\r\n```\r\n```js\r\n// within nuxt.config head\r\napp: {\r\n head: {\r\n link: [\r\n { rel: 'stylesheet', href: '~/assets/styles/print.css', media: 'print' }\r\n ],\r\n }\r\n }\r\n```\r\nHOWEVER…\r\nThese options seem to only work in development. In production, this fails for any css files referenced from the `assets` directory. \r\nSo, currently with Nuxt 3, there is no way of applying a `media` attribute for pre-processed css files.\n\n### Additional context\n\nVisit the Stackblitz example. https://stackblitz.com/edit/github-f8oum4\r\n\r\nThe text should be in royal blue. \r\n\r\nTry running `build` or `generate` on the Stackblitz example. Then preview it. Is the text still royal blue? Most likely not. This means the css was not included within the build. Bug? or by design? \r\n\r\nIf by design, then please make the css `media` attribute available via nuxt.config. \r\nSomething like: \r\n\r\n```js\r\n// nuxt.config.ts\r\nexport default defineNuxtConfig({\r\n css: [{src: '~/assets/style/screen.css', media: 'screen'}, {src: '~/assets/style/print.css', media: 'print'}]\r\n})\r\n```\n\n### Logs\n\n_No response_",[3151,3154],{"name":3152,"color":3153},"enhancement","8DEF37",{"name":3155,"color":3156},"discussion","538de2",14681,"nuxt","open","allow generating per-device css files","2024-06-30T11:10:21Z","https://github.com/nuxt/nuxt/issues/14681",0.70747054,{"description":3165,"labels":3166,"number":3170,"owner":3158,"repository":3158,"state":3159,"title":3171,"updated_at":3172,"url":3173,"score":3174},"## The issue\n\nWe are sending emails through our Nuxt app using a third-party API. We want to include the styles from our app in these emails.\n\nFor that, we need access to the compiled stylesheet. Which is currently only available under `.nuxt`\n\n## Our approach\n\nWe added [Handlebars templates](https://handlebarsjs.com/), which we evaluate into a string that is sent on the API call as the body of the email.\n\nWe considered reading some files from `.nuxt` for accessing the compiled assets. e,g:\n\n```ts\nconst manifestPath = resolve('.output/public/_nuxt/manifest.json')\nconst manifest = JSON.parse(await readFile(manifestPath, 'utf8'))\n\nconst cssFile = manifest['style.css'] || ''\n\nconst cssPath = resolve(`.output/public/_nuxt/${cssFile}`)\nconst css = readFile(cssPath)\n```\n\nBut this feels like reading a private API, there is no current documentation on how to access the compiled assets of a Nuxt app.\n\n## Where to go next\n\nIs this the right approach? Are there any plans to provide an asset pipeline on Nuxt? Are there any modules that expose the asset pipeline?",[3167],{"name":3168,"color":3169},"pending triage","E99695",31067,"[documentation][feature request] How to programmatically access compiled assets?","2025-02-24T12:00:06Z","https://github.com/nuxt/nuxt/issues/31067",0.7127158,{"labels":3176,"number":3180,"owner":3158,"repository":3158,"state":3181,"title":3182,"updated_at":3183,"url":3184,"score":3185},[3177],{"name":3178,"color":3179},"2.x","d4c5f9",4526,"closed","loading a css file from assets in NUXT layout","2023-01-18T20:06:15Z","https://github.com/nuxt/nuxt/issues/4526",0.69880575,{"labels":3187,"number":3198,"owner":3158,"repository":3158,"state":3181,"title":3199,"updated_at":3200,"url":3201,"score":3202},[3188,3191,3192,3195],{"name":3189,"color":3190},"3.x","29bc7f",{"name":3168,"color":3169},{"name":3193,"color":3194},"vite","3574D1",{"name":3196,"color":3197},"needs reproduction","FBCA04",14132,"bug css in nuxt.config","2023-01-19T17:25:19Z","https://github.com/nuxt/nuxt/issues/14132",0.70255595,{"description":3204,"labels":3205,"number":3211,"owner":3158,"repository":3158,"state":3181,"title":3212,"updated_at":3213,"url":3214,"score":3215},"I have all scss in `~/assets/main.scss`.\r\n\r\n### 1) Adding it in `css` in nuxt.config.js:\r\n`css: [{ lang: 'scss', src: '~assets/styles/main.scss' }]`\r\n**css IS NOT autoprefixed**\r\n\r\n### 2) Adding it in layout component like this:\r\n```vue\r\n\u003Cstyle lang=\"scss\">\r\n @import \"./../assets/styles/main.scss\"\r\n\u003C/style>\r\n```\r\n**css IS autoprefixed**\r\n\r\n### 3) Adding it in layout component via import\r\n ```js\r\n \u003Cscript>\r\n import '~assets/styles/main.scss'\r\n \u003C/script>\r\n ```\r\n**css IS NOT autoprefixed** AND when page loads initially html does not contain any css (it shows html without css, what a mess) and css rules are \"loaded\" after ~0.5 sec (for 0.5 sec users sees html without css).\r\n\r\n---\r\n\r\nMy question is why when I add global css (scss) (point 1) it is not autoprefixed?\n\n\u003C!--cmty-->\u003C!--cmty_prevent_hook-->\n\u003Cdiv align=\"right\">\u003Csub>\u003Cem>This feature request is available on \u003Ca href=\"https://nuxtjs.cmty.io\">Nuxt.js\u003C/a> community (\u003Ca href=\"https://nuxtjs.cmty.io/nuxt/nuxt.js/issues/c864\">#c864\u003C/a>)\u003C/em>\u003C/sub>\u003C/div>",[3206,3207,3210],{"name":3152,"color":3153},{"name":3208,"color":3209},"question","cc317c",{"name":3178,"color":3179},996,"Compiling and bundling scss - three different ways and three behaviours?","2023-01-18T15:40:38Z","https://github.com/nuxt/nuxt/issues/996",0.7062706,{"description":3217,"labels":3218,"number":3221,"owner":3158,"repository":3158,"state":3181,"title":3222,"updated_at":3223,"url":3224,"score":3225},"### Describe the feature\n\nI would like to see the `assetsInclude` config from Vite supported in the Nuxt configs. I have a few `.gltf` files that are a part of my assets directory, but currently can't get them to be included during the build. The workaround is to have them in the public directory.\n\n### Additional information\n\n- [ ] Would you be willing to help implement this feature?\n- [ ] Could this feature be implemented as a module?\n\n### Final checks\n\n- [X] Read the [contribution guide](https://nuxt.com/docs/community/contribution).\n- [X] Check existing [discussions](https://github.com/nuxt/nuxt/discussions) and [issues](https://github.com/nuxt/nuxt/issues).",[3219,3220],{"name":3189,"color":3190},{"name":3168,"color":3169},21019,"Support assetsInclude","2023-05-25T14:32:15Z","https://github.com/nuxt/nuxt/issues/21019",0.7063183,{"labels":3227,"number":3236,"owner":3158,"repository":3158,"state":3181,"title":3237,"updated_at":3238,"url":3239,"score":3240},[3228,3229,3232,3233],{"name":3189,"color":3190},{"name":3230,"color":3231},"bug","d73a4a",{"name":3193,"color":3194},{"name":3234,"color":3235},"❗ p4-important","D93F0B",13250,"assets in css include '__NUXT_BASE__' prefix in production build","2023-01-19T16:51:29Z","https://github.com/nuxt/nuxt/issues/13250",0.70737576,{"description":3242,"labels":3243,"number":3245,"owner":3158,"repository":3158,"state":3181,"title":3246,"updated_at":3213,"url":3247,"score":3248},"Hi there :)\r\nI'm trying to load a simple css file as stated in the docs. But I fail to do so. The name of css file is stored in ```assets/App.scss```. And the css section my ```nuxt.config.js``` is like below:\r\n```js\r\n css: [\r\n 'bootstrap-material-design/dist/css/bootstrap-material-design.css',\r\n 'bootstrap-material-design/dist/css/ripples.css',\r\n {src: '~assets/App.scss', lang: 'scss'}\r\n ]\r\n```\r\n\r\nBut this gives me following error:\r\n```sh\r\nThis dependency was not found:\r\n\r\n* ~assets/App.scss in ./~/babel-loader/lib?{\"presets\":[\"vue-app\"],\"babelrc\":false,\"cacheDirectory\":true}!./~/vue-loader/lib/selector.js?type=script&index=0!./.nuxt/App.vue\r\n\r\nTo install it, you can run: npm install --save ~assets/App.scss\r\n```\r\n\r\nI have read the docs many times I can't find where I'm doing wrong.\n\n\u003C!--cmty-->\u003C!--cmty_prevent_hook-->\n\u003Cdiv align=\"right\">\u003Csub>\u003Cem>This question is available on \u003Ca href=\"https://nuxtjs.cmty.io\">Nuxt.js\u003C/a> community (\u003Ca href=\"https://nuxtjs.cmty.io/nuxt/nuxt.js/issues/c867\">#c867\u003C/a>)\u003C/em>\u003C/sub>\u003C/div>",[3244],{"name":3178,"color":3179},1003,"Loading file based css","https://github.com/nuxt/nuxt/issues/1003",0.70875615,{"description":3250,"labels":3251,"number":3252,"owner":3158,"repository":3253,"state":3181,"title":3254,"updated_at":3255,"url":3256,"score":3257},"On [https://dev.nuxt.com/docs/3.x](https://dev.nuxt.com/docs/3.x) in dark mode, the \"Modular and instinctive architecture\" section has an assets misnaming bug :\n\n**Layouts-dark.svg** should be **layouts-dark.svg**\n**App-dark.svg** should be **app-dark.svg**\n\nThis only happens on the staging env.\n\n",[],744,"nuxt.com","[Docs] Assets misnaming on `3.x`","2023-02-15T12:30:54Z","https://github.com/nuxt/nuxt.com/issues/744",0.7087994,{"description":3259,"labels":3260,"number":3252,"owner":3158,"repository":3263,"state":3181,"title":3264,"updated_at":3265,"url":3266,"score":3257},"### Environment\r\n\r\n- Operating System: Linux\r\n- Node Version: v18.19.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- Build Modules: -\r\n\r\n\r\n### Reproduction\r\n\r\nhttps://stackblitz.com/edit/github-vy6psx-sn3lfr\r\n\r\n### Describe the bug\r\n\r\n`\r\n[Vue warn]: Cannot mutate \u003Cscript setup> binding \"nuxtApp\" from Options API. \r\n at \u003CMountSuspendedComponent > \r\n at \u003CMountSuspendedHelper> \r\n at \u003CAnonymous ref=\"VTU_COMPONENT\" > \r\n at \u003CVTUROOT>\r\n[Vue warn]: Unhandled error during execution of render function \r\n at \u003CMountSuspendedComponent > \r\n at \u003CMountSuspendedHelper> \r\n at \u003CAnonymous ref=\"VTU_COMPONENT\" > \r\n at \u003CVTUROOT>\r\n`\r\n\r\n \r\n \r\nI get this error message whenever I try to use useNudxtApp() in a component.\r\nBefore the merge of nuxt-vitest and @nuxt/text-utils, this worked fine.\r\n\r\n### Additional context\r\n\r\nTests can be ran with: npm run test ./pages/__tests__/index.spec.ts\r\n\r\n### Logs\r\n\r\n_No response_",[3261],{"name":3168,"color":3262},"5D08F5","test-utils","Test fails if useNuxtApp used","2024-12-03T21:09:37Z","https://github.com/nuxt/test-utils/issues/744",["Reactive",3268],{},["Set"],["ShallowReactive",3271],{"$fTRc1wZytZ_XrK4EfJfei_Sz-An4H4Yy6syhVxH_PVJc":-1,"$fWp2e074IAll7fYKbnqTnten7dloWTvdrLm1D0gs02UE":-1},"/nuxt/nuxt/32808"]