\r\n\r\n\r\nHowever, in production build, the style works. But the css link is added asynchronously, so there is no style on first render causing the page to blink.\r\n\u003Cimg width=\"699\" alt=\"image\" src=\"https://github.com/nuxt/nuxt/assets/1401172/628cf01e-b84e-43d7-af43-f8c691396e24\">\r\n\r\n",[2897],{"name":2887,"color":2888},26696,"Nuxt 3.11 with webpack builder lose style in SFC","2024-06-30T11:04:41Z","https://github.com/nuxt/nuxt/issues/26696",0.6953454,{"description":2904,"labels":2905,"number":2910,"owner":2877,"repository":2877,"state":2911,"title":2912,"updated_at":2913,"url":2914,"score":2915},"### Environment\r\n\r\n```\r\nNuxt project info: \r\n------------------------------\r\n- Operating System: Linux\r\n- Node Version: v18.18.0\r\n- Nuxt Version: 3.9.3\r\n- CLI Version: 3.10.0\r\n- Nitro Version: 2.8.1\r\n- Package Manager: npm@10.2.3\r\n- Builder: -\r\n- User Config: css, devtools\r\n- Runtime Modules: -\r\n- Build Modules: -\r\n------------------------------\r\n```\r\n\r\n### Reproduction\r\n\r\n[Nuxt 3 repo](https://stackblitz.com/edit/github-qbfhyv) vs [Nuxt 2 repo](https://stackblitz.com/edit/github-4yydwm)\r\n\r\nBoth projects implement an identical structure (layout with header and index page)\r\n\r\nIn each of the reproductions, run the necessary commands to run the project in production mode\r\n- nuxt 3 - `npm run build && npm run preview`\r\n- nuxt 2 - `npm run build && npm run start`\r\n\r\nInspect the HTML code returned by accessing the index page. Notice the `\u003Cstyle>` tag in the `\u003Chead>`\r\n\r\n### Describe the bug\r\n\r\nThe way Nuxt 3 builds and extracts the CSS from the app is inconsistent with Nuxt 2. This can cause complications when migrating an existing Nuxt 2 app.\r\n\r\nIn Nuxt 3, the global styles specified from the nuxt config are injected at the end of the style tag. With Nuxt 2, these were injected at the beginning.\r\n\r\nIn both reproduction repositories, the `@/assets/styles/global.css` file is provided globally. If you inspect the result of the HTML pages (build for production), the contents of that CSS file are placed differently.\r\n\r\n**Follow-up observation** - this might be unrelated, but you will also notice that in the case of Nuxt 3, it is including the styles for both `components/dynamic/One.vue` and `components/dynamic/Two.vue` even though only at render time only `\u003Cdynamic-one />` 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_",[2906,2909],{"name":2907,"color":2908},"3.x","29bc7f",{"name":2887,"color":2888},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.6608754,{"labels":2917,"number":2921,"owner":2877,"repository":2877,"state":2911,"title":2922,"updated_at":2923,"url":2924,"score":2925},[2918],{"name":2919,"color":2920},"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.66846144,{"description":2927,"labels":2928,"number":2931,"owner":2877,"repository":2877,"state":2911,"title":2932,"updated_at":2933,"url":2934,"score":2935},"### Environment\n\n------------------------------\r\n- Operating System: Windows_NT\r\n- Node Version: v20.14.0\r\n- Nuxt Version: 3.12.2\r\n- CLI Version: 3.12.0\r\n- Nitro Version: 2.9.6\r\n- Package Manager: npm@10.8.1\r\n- Builder: -\r\n- User Config: runtimeConfig, typescript, ssr, devtools, app, modules, primevue, css, validations, devServer, routeRules\r\n- Runtime Modules: nuxt-primevue@3.0.0, @nuxt/eslint@0.3.13, @nuxt/test-utils/module@3.13.1\r\n- Build Modules: -\r\n------------------------------\r\n\n\n### Reproduction\n\nTo reproduce this problem, you can place the elements in the nuxt.config.ts file as shown in the image below:\r\n\r\n```\r\napp: {\r\n head: {\r\n link: [\r\n {\r\n id: 'theme-css',\r\n rel: 'stylesheet',\r\n type: 'text/css',\r\n href: '/themes/mdc-light-indigo/theme.css',\r\n },\r\n {\r\n id: 'theme-css-override',\r\n rel: 'stylesheet',\r\n type: 'text/css',\r\n href: '/themes/mdc-light-indigo/override.css',\r\n },\r\n ],\r\n script: [\r\n {\r\n innerHTML: `\r\n window._historyCache = {\r\n replaceState: window.history.replaceState,\r\n pushState: window.history.pushState\r\n };`,\r\n },\r\n {\r\n src: 'https://appsforoffice.microsoft.com/lib/1/hosted/office.js',\r\n defer: false,\r\n type: 'text/javascript',\r\n },\r\n {\r\n innerHTML: `\r\n window.history.replaceState = window._historyCache.replaceState;\r\n window.history.pushState = window._historyCache.pushState;`,\r\n },\r\n ],\r\n },\r\n},\r\n```\r\n\r\n\r\n\r\n\n\n### Describe the bug\n\nIn Nuxt 3.11.2, the order of scripts is preserved as expected (innerHTML - src - innerHTML), ensuring that the inline script content executes in the correct sequence.\r\n\r\nHowever, in Nuxt 3.12.2, there has been a change in the script execution order: scripts with the \"src\" attribute are moved to the top (src - innerHTML - innerHTML). This can affect the behavior of applications that rely on a specific script execution order, potentially causing compatibility and functionality issues.\r\n\r\nNuxt 3.11.2\r\n\r\n\r\nNuxt 3.12.2\r\n\r\n\r\nIs there a way to restore the original script order?\n\n### Additional context\n\n_No response_\n\n### Logs\n\n_No response_",[2929,2930],{"name":2907,"color":2908},{"name":2887,"color":2888},27686,"Change in Script Order between Nuxt 3.11.2 and Nuxt 3.12.2","2024-06-20T13:11:33Z","https://github.com/nuxt/nuxt/issues/27686",0.6751301,{"description":2937,"labels":2938,"number":2941,"owner":2877,"repository":2877,"state":2911,"title":2942,"updated_at":2943,"url":2944,"score":2945},"### Environment\n\n------------------------------\r\n- Operating System: Linux\r\n- Node Version: v18.16.0\r\n- Nuxt Version: 3.5.0\r\n- Nitro Version: 2.4.1\r\n- Package Manager: pnpm@8.5.1\r\n- Builder: vite\r\n- User Config: -\r\n- Runtime Modules: -\r\n- Build Modules: -\r\n------------------------------\n\n### Reproduction\n\nhttps://github.com/productdevbook/bug-tailwindcss\n\n### Describe the bug\n\npnpm i\r\npnpm dev web\r\n\r\nthis color dont see .md files\r\n\r\n```\r\n modules: [\r\n '@nuxtjs/tailwindcss',\r\n '@nuxt/content',\r\n ],\r\n``` \r\n\r\n\r\n\r\nif `layer` nuxt.config.ts in change array order, will working tailwindcss\r\n\r\n```\r\n modules: [\r\n '@nuxt/content',\r\n '@nuxtjs/tailwindcss',\r\n ],\r\n``` \r\n\r\n\r\n\n\n### Additional context\n\n_No response_\n\n### Logs\n\n_No response_",[2939,2940],{"name":2907,"color":2908},{"name":2887,"color":2888},21415,"tailwindcss modules order problem","2023-06-06T22:05:17Z","https://github.com/nuxt/nuxt/issues/21415",0.6773431,{"description":2947,"labels":2948,"number":2957,"owner":2877,"repository":2877,"state":2911,"title":2958,"updated_at":2959,"url":2960,"score":2961},"### Environment\n\n------------------------------\r\n- Operating System: Linux\r\n- Node Version: v16.20.0\r\n- Nuxt Version: 3.7.1\r\n- CLI Version: 3.8.1\r\n- Nitro Version: 2.6.3\r\n- Package Manager: npm@9.4.2\r\n- Builder: -\r\n- User Config: extends\r\n- Runtime Modules: -\r\n- Build Modules: -\r\n------------------------------\n\n### Reproduction\n\nhttps://stackblitz.com/edit/nuxt-starter-g42wkd?file=nuxt.config.ts\n\n### Describe the bug\n\nThe order of plugin execution is not correct when using layers. Plugins that are defined in lower layers execute after plugins defined in higher layers. This causes incorrect behavior when a plugin override is necessary. In the provided repo a use case of overriding the same entity from a higher level is not possible due to this issue.\n\n### Additional context\n\n_No response_\n\n### Logs\n\n_No response_",[2949,2950,2951,2954],{"name":2907,"color":2908},{"name":2868,"color":2869},{"name":2952,"color":2953},"馃敤 p3-minor","FBCA04",{"name":2955,"color":2956},"layers","006B75",23123,"[Bug] Plugin Registration Order is not deterministic when using layers","2023-09-12T14:24:37Z","https://github.com/nuxt/nuxt/issues/23123",0.6875067,{"description":2963,"labels":2964,"number":2971,"owner":2877,"repository":2972,"state":2911,"title":2973,"updated_at":2974,"url":2975,"score":2976},"### Description\n\nI'm trying to understand both how and why the default CSS layer ordering is set. Looking through the `@nuxt/ui` code, I don't see anything that would set this ordering beyond what is used by `@tailwindcss/vite`. Additionally, it seems like an odd order...why doesn't theme come before base, for example? And does properties belong right in the middle?\n\n\n\nNote: This is from a fresh install of 3.1.1 in code sandbox.\nhttps://codesandbox.io/p/devbox/clever-ptolemy-vcshnz",[2965,2968],{"name":2966,"color":2967},"question","d876e3",{"name":2969,"color":2970},"v3","49DCB8",4054,"ui","Default CSS layer ordering","2025-05-03T17:56:19Z","https://github.com/nuxt/ui/issues/4054",0.6879127,{"description":2978,"labels":2979,"number":2984,"owner":2877,"repository":2877,"state":2911,"title":2985,"updated_at":2986,"url":2987,"score":2988},"### 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_",[2980,2981,2982,2983],{"name":2907,"color":2908},{"name":2868,"color":2869},{"name":2871,"color":2872},{"name":2952,"color":2953},22932,"Styles not always in correct order when in production (SSG)","2023-09-04T11:31:34Z","https://github.com/nuxt/nuxt/issues/22932",0.68971956,["Reactive",2990],{},["Set"],["ShallowReactive",2993],{"$fTRc1wZytZ_XrK4EfJfei_Sz-An4H4Yy6syhVxH_PVJc":-1,"$fzuirbo1VSnQtZKZarLp4FeTriDakfrpATOT1RyH5xOo":-1},"/nuxt/ui/4058"]