Import file as raw string on a config file (UnoCSS config in this case)
I'm trying to import a css file as a string on a configuration file, in this case is for a feature of UnoCSS named "preflights" which lets you set up css for themes from strings, I'm using
import globalCSS from './app/styles/theme-base.css?raw' within the config but I'm getting
Cannot restart nuxt: Unknown file extension ".css" for <full file path> any idea on how to make the import work? I'm inlining the css instead of using the file as a workaround.
Nuxt 4 compat.
edit: fixed it by using normal fs from Node, looks like the module config doesnt go through vite2 Replies
Hi @iFran. I'm kapa.ai, your friendly support bot. I will try to answer your question by searching through the knowledge base. :wave:
----------------------
I'm sorry, but the knowledge sources do not contain explicit information about importing a CSS file as a raw string in a configuration file (such as UnoCSS config) within a Nuxt project, nor do they address the use of the ?raw import suffix or how to resolve the "Unknown file extension '.css'" error in this context.
The available documentation covers how to include CSS files globally using the css property in nuxt.config, how to use preprocessors, and how to reference stylesheets in components, but does not mention importing CSS as a raw string in config files or handling such imports for UnoCSS preflights specifically. If you need to inline CSS, the workaround you mentioned (manually inlining the CSS string) is not contradicted or improved upon by the current knowledge sources Styling in Nuxt Nuxt config css property.
If you need further help, you may want to consult UnoCSS or Vite documentation directly, or open an issue on the Nuxt or UnoCSS repositories.
----------------------
Note: you can ask me a follow up question by @ mentioning me again :speech_balloon:
----------------------
<@190075813603966976> Kapa.ai is still learning and improving, please let me know how I did by reacting below.