` is rendered. Nuxt 2 correctly only includes the styles from `One.vue`.\r\n\r\nIf unrelated (and is considered to be an issue) i am happy to open a separate report.\r\n\r\n### Additional context\r\n\r\nWe are in the process of migrating our Nuxt 2 app to Nuxt 3 and are running into multiple complications - this is one of them.\r\n\r\nIn the case of developing an app from scratch this would not be an issue because it would inform the development style.\r\n\r\nHowever, in our case some of the global styles get overridden by rules at the component level. The new order in Nuxt 3 causes this to break.\r\n\r\n### Logs\r\n\r\n_No response_",[2941,2944],{"name":2942,"color":2943},"3.x","29bc7f",{"name":2945,"color":2946},"pending triage","E99695",25393,"closed","Discrepancies in production build styles order (compared to nuxt 2)","2024-01-26T20:16:35Z","https://github.com/nuxt/nuxt/issues/25393",0.61824137,{"description":2954,"labels":2955,"number":2964,"owner":2931,"repository":2931,"state":2948,"title":2965,"updated_at":2966,"url":2967,"score":2968},"### Environment\n\n- Operating System: `Darwin`\r\n- Node Version: `v16.15.1`\r\n- Nuxt Version: `3.6.5`\r\n- Nitro Version: `2.5.2`\r\n- Package Manager: `yarn@1.22.19`\r\n- Builder: `vite`\r\n- User Config: `app`, `runtimeConfig`, `css`, `vite`, `experimental`, `modules`, `build`, `sanity`\r\n- Runtime Modules: `@nuxtjs/sanity@1.8.0`, `@pinia/nuxt@0.4.11`, `nuxt-graphql-client@0.2.29`, `@vueuse/nuxt@10.2.1`\r\n- Build Modules: `-`\r\n\n\n### Reproduction\n\nSee screenshots attached... feel as though they'll clear enough.\n\n### Describe the bug\n\nStyles order set within a template .vue file aren't reflected during a production build (SSG, for example)\r\n\r\n\r\n\r\n\r\nThese above screenshots show the code in the editor as well as what is outputted during local development but in the following screenshots, in production, `font-feature-settings: 'case' on;` is moved to the top.\r\n\r\n\r\n\r\n\r\nAny known reason why this would happen? And if I can resolve?\n\n### Additional context\n\n_No response_\n\n### Logs\n\n_No response_",[2956,2957,2958,2961],{"name":2942,"color":2943},{"name":2922,"color":2923},{"name":2959,"color":2960},"vite","3574D1",{"name":2962,"color":2963},"🔨 p3-minor","FBCA04",22932,"Styles not always in correct order when in production (SSG)","2023-09-04T11:31:34Z","https://github.com/nuxt/nuxt/issues/22932",0.61997086,{"labels":2970,"number":2974,"owner":2931,"repository":2931,"state":2948,"title":2975,"updated_at":2976,"url":2977,"score":2978},[2971],{"name":2972,"color":2973},"2.x","d4c5f9",9351,"The order of reading css changes when node_env ='production'","2023-01-18T22:05:29Z","https://github.com/nuxt/nuxt/issues/9351",0.6266261,{"description":2980,"labels":2981,"number":2991,"owner":2931,"repository":2931,"state":2948,"title":2992,"updated_at":2993,"url":2994,"score":2995},"### Environment\r\n\r\n------------------------------\r\n- Operating System: Linux\r\n- Node Version: v18.18.0\r\n- Nuxt Version: 3.11.2\r\n- CLI Version: 3.11.1\r\n- Nitro Version: 2.9.6\r\n- Package Manager: npm@10.2.3\r\n- Builder: -\r\n- User Config: devtools\r\n- Runtime Modules: -\r\n- Build Modules: -\r\n------------------------------\r\n\r\n### Reproduction\r\n\r\nhttps://stackblitz.com/edit/github-kz3fe2?file=components%2FMyComponent.vue\r\n\r\n### Describe the bug\r\n\r\nWhen using scoped CSS (might also be without scoped, haven't tried), there's a problem after building:\r\n1. The CSS for the component gets added _inline_ **and** as a `\u003Clink>`\r\n2. All the CSS files are declared before the JS files, instead of after (in Nuxt 2 JS files came first, so the browser can start loading them async).\r\n\r\n#2 is not a direct problem, because browsers don't wait for the CSS to load in order to start loading JS, but since the JS is preloaded, it might still be better to hoist them above CSS?\r\n\r\n### Additional context\r\n\r\nWe discovered this while profiling our project in production and saw some odd results from Lighthouse, complaining about render blocking CSS.\r\n\r\nWe then noticed that almost all of the CSS was loaded twice (once inline, and once through `\u003Clink>`s).\r\nThe order was also reversed from Nuxt 2, even though that might not be so much of a bug.\r\n\r\nComparing the Lighthouse feedback from Nuxt 2 to Nuxt 3 (in our prod app), a few things are striking:\r\n- In Nuxt3: **all** the stylesheets are marked as \"A late network request adjusted the page layout\", whereas in Nuxt 2 this doesn't happen.\r\n- **None** of the css files are marked as preload in Nuxt 3, whereas they are in Nuxt 2\r\n\r\n### Logs\r\n\r\n_No response_",[2982,2983,2985,2988],{"name":2942,"color":2943},{"name":2984,"color":2963},"needs reproduction",{"name":2986,"color":2987},"closed-by-bot","ededed",{"name":2989,"color":2990},"inline styles","68AF97",27053,"Styles get added both inline and by reference and precede JS files","2024-06-01T01:51:52Z","https://github.com/nuxt/nuxt/issues/27053",0.6330728,{"description":2997,"labels":2998,"number":3001,"owner":2931,"repository":2931,"state":2948,"title":3002,"updated_at":3003,"url":3004,"score":3005},"### Environment\r\n\r\n------------------------------\r\n- Operating System: Linux\r\n- Node Version: v16.20.0\r\n- Nuxt Version: 3.6.3\r\n- Nitro Version: 2.5.2\r\n- Package Manager: npm@9.4.2\r\n- Builder: vite\r\n- User Config: experimental, components\r\n- Runtime Modules: -\r\n- Build Modules: -\r\n------------------------------\r\n\r\n### Reproduction\r\n\r\nhttps://stackblitz.com/edit/github-ngduht?file=nuxt.config.ts\r\n\r\n### Describe the bug\r\n\r\nI have a strange behaviour on my project, I was able to reproduce it in a lighter environment.\r\n\r\nSome components style are inline by the server, while others are not.\r\n\r\nI can't figure out why :man_shrugging: \r\n\r\nWhen my component is not in lazy (TopBanner) i don't get style on the server \r\n\r\n\r\nWhen i add `Lazy` prefix, my component is rendered as expected, but on my larger project `Lazy` prefix doesn't change anything. And act like a css flickering...\r\n\r\nHow Vite/Nitro decide which style is inline ? :thinking: \r\n\r\n\r\n### Additional context\r\n\r\n_No response_\r\n\r\n### Logs\r\n\r\n_No response_",[2999,3000],{"name":2942,"color":2943},{"name":2945,"color":2946},22215,"Strange behaviour with inline style","2024-06-15T22:30:42Z","https://github.com/nuxt/nuxt/issues/22215",0.6413524,{"description":3007,"labels":3008,"number":3012,"owner":2931,"repository":2931,"state":2948,"title":3013,"updated_at":3014,"url":3015,"score":3016},"### Environment\r\n\r\n------------------------------\r\n- Operating System: `Windows_NT`\r\n- Node Version: `v16.15.0`\r\n- Nuxt Version: `3.0.0-rc.10`\r\n- Nitro Version: `0.5.3`\r\n- Package Manager: `npm@8.11.0`\r\n- Builder: `vite`\r\n- User Config: `-`\r\n- Runtime Modules: `-`\r\n- Build Modules: `-`\r\n------------------------------\r\n- With UnoCSS and preflight activated for CSS\r\n\r\n### Reproduction\r\n\r\nSee this repo for reproduction : https://github.com/g4w3l/nuxt3rc10-unocss\r\n\r\n- If you launch the server with `npm run dev`, when you go on `/page1` you see a green button as expected\r\n- If you build it and launch it with \r\n```\r\nnpm run build\r\nnode .output/server/index.mjs\r\n```\r\nThe button on `/page1` goes transparent\r\n\r\n### Describe the bug\r\n\r\nI've put some styles on a button in a component. All works well in `dev` mode, if you inspect the `\u003Cbutton>`, the order of the styles is correct and the `bg-green` is applied : \r\n\r\n\r\nIn built version the order of the styles is inverted, thus the button is transparent : \r\n\r\n\r\n\r\n\r\n### Additional context\r\n\r\n_No response_\r\n\r\n### Logs\r\n\r\n_No response_",[3009,3010,3011],{"name":2942,"color":2943},{"name":2922,"color":2923},{"name":2962,"color":2963},14943,"Nuxt RC10 - Reset inline styles take priority on built bundle","2023-01-19T17:42:57Z","https://github.com/nuxt/nuxt/issues/14943",0.64294165,{"description":3018,"labels":3019,"number":3024,"owner":2931,"repository":2931,"state":2948,"title":3025,"updated_at":3026,"url":3027,"score":3028},"### Environment\n\n------------------------------\r\n- Operating System: Windows_NT\r\n- Node Version: v18.16.0\r\n- Nuxt Version: 3.4.3\r\n- Nitro Version: 2.3.3\r\n- Package Manager: npm@9.6.5\r\n- Builder: vite\r\n- User Config: srcDir, ssr, modules, dir\r\n- Build Modules: -\r\n------------------------------\n\n### Reproduction\n\nMinimal repro: https://stackblitz.com/edit/nuxt-starter-ycw6ts\n\n### Describe the bug\n\nThe output order between \u003Clink rel=\"stylesheet\"> in template and \u003Cstyle> in component is different between SSR=true and SSR=false. \r\n\r\nFor example the following App.vue: \r\n```\r\n\u003Ctemplate>\r\n...\r\n\u003CHead>\r\n\u003CLink id=\"theme-link\" rel=\"stylesheet\" href=\"/public.css\" /> NOTE: the reason I use Link here is that later in the code I can use id to dynamically change this public.css's location. \r\n...\r\n\u003C/template>\r\n\u003Cstyle src=\"@/assets/override.scss\" />\r\n```\r\nMy expectation would be override.scss content has to happen after public.css since override.scss could be overriding stuff from public.css. I have noticed that when SSR=true, the order is expected. But when I set SSR=false, the override.scss content actually is before public.css. \r\n\r\nMinimal Repro Link is here: https://stackblitz.com/edit/nuxt-starter-ycw6ts (button is blue when SSR=true, but is red when SSR=false)\n\n### Additional context\n\n_No response_\n\n### Logs\n\n_No response_",[3020,3021,3022,3023],{"name":2942,"color":2943},{"name":2922,"color":2923},{"name":2959,"color":2960},{"name":2962,"color":2963},20662,"CSS Loading Order Inconsistent (SSR vs no SSR)","2024-03-11T18:15:45Z","https://github.com/nuxt/nuxt/issues/20662",0.64334285,{"description":3030,"labels":3031,"number":3034,"owner":2931,"repository":2931,"state":2948,"title":3035,"updated_at":3036,"url":3037,"score":3038},"### Environment\n\nNuxi 3.0.0-rc.11 19:06:28\r\nRootDir: /Users/konradstraszewski/WebstormProjects/lendi-b2c 19:06:29\r\nNuxt project info: (copied to clipboard) 19:06:29\r\n\r\n------------------------------\r\n- Operating System: `Darwin`\r\n- Node Version: `v16.14.0`\r\n- Nuxt Version: `3.0.0-rc.11`\r\n- Nitro Version: `0.5.4`\r\n- Package Manager: `npm@8.19.0`\r\n- Builder: `vite`\r\n- User Config: `app`, `ssr`, `experimental`, `postcss`, `nitro`, `css`, `meta`, `modules`, `image`, `unocss`, `publicRuntimeConfig`, `vite`, `nuxtTypedRouter`, `plugins`\r\n- Runtime Modules: `nuxt-typed-router@1.2.2`, `@unocss/nuxt@0.45.22`, `@nuxt/image-edge@1.0.0-27707824.1028381`, `nuxt-jsonld@2.0.5`, `@pinia/nuxt@0.4.1`, `@vueuse/nuxt@8.9.2`, `()`\r\n- Build Modules: `-`\r\n\n\n### Reproduction\n\nhttps://stackblitz.com/edit/github-w6cj1g-1libb7?file=pages%2Findex.vue\r\n\r\n1. nuxt build && nuxt preview\n\n### Describe the bug\n\nIn production mode i've noticed that scoped css from index.vue are loaded twice. You end up with a inlined CSS in your HTML and also the same CSS is loaded by the CSS chunk from page. You can see that `test-class` added in pages/index is loaded in inlined HTML and also loaded on the end in index.css.\r\n\r\nYou can see this behavior more clearly here: https://qa.lendi.pl/. Let get this blue arrow for example it has `best-offer-arrow` class. It is declared in pages/index.vue. It is loaded inlined (elements -> ctrl + f -> `best-offer-arrow`), and also it's loaded in index.css. It affects performance of the site\n\n### Additional context\n\n_No response_\n\n### Logs\n\n_No response_",[3032,3033],{"name":2942,"color":2943},{"name":2945,"color":2946},14993,"Duplicated inlined css","2023-01-19T17:43:28Z","https://github.com/nuxt/nuxt/issues/14993",0.64485025,{"description":3040,"labels":3041,"number":3045,"owner":2931,"repository":2931,"state":2948,"title":3046,"updated_at":3047,"url":3048,"score":3049},"### Environment\n\n------------------------------\n- Operating System: Darwin\n- Node Version: v18.18.2\n- Nuxt Version: 3.14.1592\n- CLI Version: 3.16.0\n- Nitro Version: 2.10.4\n- Package Manager: yarn@3.2.4\n- Builder: vite\n- User Config: default\n- Runtime Modules: nuxt-vite-legacy@1.3.1, @pinia/nuxt@0.4.11, floating-vue/nuxt, ~/modules\n- Build Modules: -\n------------------------------\n\n### Reproduction\n\nI'll try to make a reproduction, but there has been many open tickets about this before and seem to have been closed which I don't know why.\nThis issue happens only in development when using latest Nuxt version with Vite as a builder.\n\n### Describe the bug\n\nI get a flash of the rendered page without CSS before Vite dev server starts serving the next content. I should expect that the current requested document should be able to load its css similar as PROD.\n\n### Additional context\n\n_No response_\n\n### Logs\n\n```shell-script\n\n```",[3042,3043,3044],{"name":2945,"color":2946},{"name":2984,"color":2963},{"name":2986,"color":2987},30125,"FOUC when using Vite in development mode (using mono-repo)","2024-12-11T02:06:46Z","https://github.com/nuxt/nuxt/issues/30125",0.6564281,["Reactive",3051],{},["Set"],["ShallowReactive",3054],{"$fTRc1wZytZ_XrK4EfJfei_Sz-An4H4Yy6syhVxH_PVJc":-1,"$fc6vIPIiXjtHT5mF4k9QFGNE8e6hStNK2D2Ch6WQDhB0":-1},"/nuxt/nuxt/15048"]