\n\nFrom what I understand, according to the error logged, the issue is caused by the resulting css tree having nested `@source` declarations.\n\n### Additional context\n\nI'm working on migrating an existing website that was built using Bootstrap (lol) and I'd like to use layers to ensure the newer css gets a higher priority than the old one.\n\nUsing `@import \"tailwindcss\" layer(tailwindcss);` results in all the tailwind stuff being scoped to the `tailwindcss` layer (eg. `tailwindcss.theme`, `tailwindcss.base`…).\n\nHowever, when I try to do the same for `@import \"@nuxt/ui\"` I get the previously mentioned error.\n\nI've tried using both the same and a different layer name than the one I use for tailwind but I still get the error.\n\n### Logs\n\n```shell-script\nERROR Pre-transform error: @source cannot be nested. 12:42:31 PM\n Plugin: @tailwindcss/vite:generate:serve\n File: /project/workspace/app/assets/css/main.css\n```",[3019,3022,3025],{"name":3020,"color":3021},"bug","d73a4a",{"name":3023,"color":3024},"v3","49DCB8",{"name":3026,"color":3027},"triage","ffffff",4503,"nuxt","ui","open","`@import \"@nuxt/ui\" layer(layer-name);` not working","2025-07-11T13:35:06Z","https://github.com/nuxt/ui/issues/4503",0.65015787,{"description":3037,"labels":3038,"number":3048,"owner":3029,"repository":3029,"state":3049,"title":3050,"updated_at":3051,"url":3052,"score":3053},"### Environment\n\n------------------------------\r\n- Operating System: `Windows_NT`\r\n- Node Version: `v16.16.0`\r\n- Nuxt Version: `3.2.3`\r\n- Nitro Version: `2.2.3`\r\n- Package Manager: `npm@9.4.0`\r\n- Builder: `vite`\r\n- User Config: `alias`, `app`, `build`, `imports`, `modules`, `naiveUI`, `ssr`, `supabase`, `runtimeConfig`, `tailwindcss`, `typescript`\r\n- Runtime Modules: `@vueuse/nuxt@9.13.0`, `@nuxtjs/tailwindcss@6.4.1`, `@pinia/nuxt@0.4.7`, `@nuxtjs/critters@0.4.0`, `@nuxtjs/fontaine@0.2.4`, `@nuxtjs/google-fonts@3.0.0-1`, `@nuxt/image-edge@1.0.0-27954023.4cee565`, `nuxt-headlessui@1.1.1`, `@nuxtjs/supabase@0.3.1`, `@formkit/nuxt@1.0.0-beta.15`, `@huntersofbook/naive-ui-nuxt@0.7.1` \r\n- Build Modules: `-`\n\n### Reproduction\n\nI am sorry to open this without a reproduction, but I simply cannot reproduce this. It happens in a specific repo, and I have tried thousands of things, though cannot find what causes the issue. \r\n\r\nI am opening this issue so that people can weigh in and if there are others experiencing this, they can use the hack I've found (see below).\n\n### Describe the bug\n\nAuto import of my components work great. But their types are not recognized in VS Code. Whenever I hover over a component in the `\u003Ctemplate>` section of an SFC, its type is indicated as `any`. \r\n\r\nIt is very weird but I've found a hack: When I reference the `.nuxt/components` path anywhere in the project, the types start working. So I added this line to my `app.vue` file:\r\n\r\n```\r\nimport {} from \".nuxt/components\";\r\n``` \r\n\r\nI think something is causing Nuxt to ignore the `.nuxt/components` path but when I reference it somewhere, Nuxt starts recognizing it back.\r\n\r\nI'd be forever grateful if someone knows what is going on here and suggest where to look.\n\n### Additional context\n\n_No response_\n\n### Logs\n\n_No response_",[3039,3042,3045],{"name":3040,"color":3041},"3.x","29bc7f",{"name":3043,"color":3044},"pending triage","E99695",{"name":3046,"color":3047},"needs reproduction","FBCA04",19427,"closed","Auto imported component types do not work","2023-03-08T08:40:06Z","https://github.com/nuxt/nuxt/issues/19427",0.6339893,{"description":3055,"labels":3056,"number":3068,"owner":3029,"repository":3029,"state":3049,"title":3069,"updated_at":3070,"url":3071,"score":3072},"### Environment\n\nStackblitz\r\n\r\n````\r\n------------------------------\r\n- Operating System: Linux\r\n- Node Version: v18.18.0\r\n- Nuxt Version: 3.10.3\r\n- CLI Version: 3.10.1\r\n- Nitro Version: -\r\n- Package Manager: npm@10.2.3\r\n- Builder: -\r\n- User Config: extends\r\n- Runtime Modules: -\r\n- Build Modules: -\r\n------------------------------\r\n````\n\n### Reproduction\n\nhttps://stackblitz.com/github/martinszeltins/found-nuxt-components-issue?file=app.vue\n\n### Describe the bug\n\nWhen I add this module to my modules array in nuxt.config.ts then I lose all typings for my components _(for both local and 3rd party components)._ It shows that components have type of `unknown`. Before I add this module, everything works.\r\n\r\n**nuxt.config.ts** 👇️\r\n```diff\r\nmodules: [\r\n+ '@nuxtjs/i18n', // This breaks all auto-import component typings (components not recognized anymore)\r\n '@vueuse/nuxt',\r\n 'nuxt-primevue'\r\n],\r\n```\r\n\r\nIf I remove it from my modules array then everything works again.\r\n\r\n**Screenshot before adding the module (everything works):** 👍️ 👇️\r\n\r\n\r\n\r\n**Screenshot after adding the module (type unknown):** ❌ 👇️\r\n\r\n\r\n\n\n### Additional context\n\n_No response_\n\n### Logs\n\n_No response_",[3057,3060,3061,3064,3065],{"name":3058,"color":3059},"types","2875C3",{"name":3040,"color":3041},{"name":3062,"color":3063},"workaround available","11376d",{"name":3020,"color":3021},{"name":3066,"color":3067},"upstream","E8A36D",26214,"Adding `@nuxtjs/i18n` to Nuxt breaks component types (shows unknown)","2024-05-27T10:28:40Z","https://github.com/nuxt/nuxt/issues/26214",0.6396136,{"description":3074,"labels":3075,"number":3085,"owner":3029,"repository":3030,"state":3049,"title":3086,"updated_at":3087,"url":3088,"score":3089},"### Description\n\nNow that nuxt by default doesn't enable shamefully-hoist we cannot import from tailwind directly because it is a subdependancy of @nuxt/ui.\r\n\r\n```ts\r\nimport type { Config } from \"tailwindcss\";\r\n\r\n// - or -\r\n\r\n/** @type {import('tailwindcss').Config} */\r\n```\r\n So this gives `Cannot find module 'tailwindcss' or its corresponding type declarations.` error. This means that we get no typesafety in our tailwind.config.[ts|js] files.\r\n\r\nDocumentation specifically [3.theming.md](https://github.com/nuxt/ui/blob/dev/docs/content/1.getting-started/3.theming.md) would also need to be updated to reflect these changes.\r\n\r\n\r\nThe same issue also effects the `icon`, `colorMode` and `tailwindcss` keys in the `nuxt.config.ts`.\r\n\r\n```ts\r\nexport default defineNuxtConfig({\r\n compatibilityDate: \"2024-04-03\",\r\n devtools: { enabled: true },\r\n modules: [\"@nuxt/ui\"],\r\n ui: {},\r\n icon: {}, // \u003C- typed any\r\n});\r\n```\r\n\r\n`.nuxt/types/schema.d.ts` file is the file that defines the types for the `nuxt.config.ts` and because it is a part of our project. The imports from the individual subdependency modules like `@nuxt/icon` are broken.\r\n\r\n```ts\r\n// .nuxt/types/schema.d.ts\r\ninterface NuxtConfig {\r\n [\"icon\"]?: typeof import(\"@nuxt/icon\").default extends NuxtModule\u003Cinfer O> ? Partial\u003CO> : Record\u003Cstring, any>, .....\r\n // ^? any\r\n}\r\n```\r\n\r\nIf it is the case that we cannot manipulate the output of `schema.d.ts` file to import the re-exported types rather than the original ones we can add a [type template](https://nuxt.com/docs/api/kit/templates#addtypetemplate) that would import and declare the default export of the respective module like this \r\n\r\n```ts\r\nimport type { ReExportedIconModuleType } from \"@nuxt/ui/types\"\r\ndeclare module \"@nuxt/icon\" {\r\n export default ReExportedIconModuleType;\r\n}\r\n```\n\n### Additional context\n\n_No response_",[3076,3079,3080,3083],{"name":3077,"color":3078},"enhancement","a2eeef",{"name":3026,"color":3027},{"name":3081,"color":3082},"closed-by-bot","ededed",{"name":3084,"color":3082},"stale",2032,"Re-export types of subdependencies","2025-06-18T09:06:37Z","https://github.com/nuxt/ui/issues/2032",0.6517366,{"labels":3091,"number":3094,"owner":3029,"repository":3029,"state":3049,"title":3095,"updated_at":3096,"url":3097,"score":3098},[3092,3093],{"name":3040,"color":3041},{"name":3043,"color":3044},14561,"Type errors in generated `components.d.ts`","2023-01-19T17:37:13Z","https://github.com/nuxt/nuxt/issues/14561",0.6524471,{"description":3100,"labels":3101,"number":3105,"owner":3029,"repository":3029,"state":3049,"title":3106,"updated_at":3107,"url":3108,"score":3109},"### Environment\n\n- Operating System: `Darwin`\r\n- Node Version: `v16.14.2`\r\n- Nuxt Version: `3.0.0-rc.13`\r\n- Nitro Version: `0.6.1`\r\n- Package Manager: `npm@8.5.0`\r\n- Builder: `vite`\r\n- User Config: `-`\r\n- Runtime Modules: `-`\r\n- Build Modules: `-`\r\n\n\n### Reproduction\n\nCheckout this PR: https://github.com/sidebase/nuxt-auth/pull/22\r\n\r\nThe upgrade to rc.13 was done via `npx nuxi@latest upgrade --force`\n\n### Describe the bug\n\nAfter upgraging to `nuxt rc.13`, when type-checking the `nuxt-auth` module we get:\r\n```sh\r\n❯ npm run types\r\n\r\n> @sidebase/nuxt-auth@0.0.1-beta.5 types\r\n> tsc --noEmit\r\n\r\nplayground/nuxt.config.ts:4:13 - error TS2322: Type 'NuxtModule\u003CModuleOptions>' is not assignable to type 'string | NuxtModule\u003CModuleOptions> | [(string | NuxtModule\u003CModuleOptions> | undefined)?, ({ [x: string]: any; } | undefined)?] | undefined'.\r\n Type 'import(\"~/repos/sidebase/nuxt-auth/node_modules/@nuxt/schema/dist/index\").NuxtModule\u003CModuleOptions>' is not assignable to type 'import(\"~/repos/sidebase/nuxt-auth/node_modules/@nuxt/schema/dist/index\").NuxtModule\u003Cimport(\"~/repos/sidebase/nuxt-auth/node_modules/@nuxt/schema/dist/index\").ModuleOptions>'.\r\n Types of property 'getOptions' are incompatible.\r\n Type '((inlineOptions?: ModuleOptions | undefined, nuxt?: import(\"~/repos/sidebase/nuxt-auth/node_modules/@nuxt/schema/dist/index\").Nuxt | undefined) => Promise\u003C...>) | undefined' is not assignable to type '((inlineOptions?: import(\"~/repos/sidebase/nuxt-auth/node_modules/@nuxt/schema/dist/index\").ModuleOptions | undefined, nuxt?: import(\"~/repos/sidebase/nuxt-auth/node_modules/@nuxt/schema/dist/index\").Nuxt | undefined) => Promise\u003C...>) | undefined'.\r\n Type '(inlineOptions?: ModuleOptions | undefined, nuxt?: import(\"~/repos/sidebase/nuxt-auth/node_modules/@nuxt/schema/dist/index\").Nuxt | undefined) => Promise\u003C...>' is not assignable to type '(inlineOptions?: import(\"~/repos/sidebase/nuxt-auth/node_modules/@nuxt/schema/dist/index\").ModuleOptions | undefined, nuxt?: import(\"~/repos/sidebase/nuxt-auth/node_modules/@nuxt/schema/dist/index\").Nuxt | undefined) => Promise\u003C...>'.\r\n Types of parameters 'inlineOptions' and 'inlineOptions' are incompatible.\r\n Type 'import(\"~/repos/sidebase/nuxt-auth/node_modules/@nuxt/schema/dist/index\").ModuleOptions | undefined' is not assignable to type 'ModuleOptions | undefined'.\r\n Type 'import(\"~/repos/sidebase/nuxt-auth/node_modules/@nuxt/schema/dist/index\").ModuleOptions' is not assignable to type 'ModuleOptions'.\r\n\r\n4 modules: [NuxtAuth],\r\n```\r\n\r\nTs seems to hand itself up with the \"not quite\" sameness of `ModuleOptions` in the last line:\r\n```\r\n Type 'import(\"~/repos/sidebase/nuxt-auth/node_modules/@nuxt/schema/dist/index\").ModuleOptions' is not assignable to type 'ModuleOptions'\r\n```\r\n\r\nmaybe this is related to making TS stricter in RC13?\n\n### Additional context\n\n_No response_\n\n### Logs\n\n_No response_",[3102,3103,3104],{"name":3040,"color":3041},{"name":3043,"color":3044},{"name":3046,"color":3047},15455,"RC.13 module config: Type 'import(\".../@nuxt/schema/dist/index\").ModuleOptions' is not assignable to type 'ModuleOptions'","2023-01-30T10:40:02Z","https://github.com/nuxt/nuxt/issues/15455",0.65313196,{"description":3111,"labels":3112,"number":3115,"owner":3029,"repository":3029,"state":3049,"title":3116,"updated_at":3117,"url":3118,"score":3119},"### Environment\r\n\r\n------------------------------\r\n- Operating System: Windows_NT\r\n- Node Version: v18.16.0\r\n- Nuxt Version: 3.7.0\r\n- CLI Version: 3.7.0\r\n- Nitro Version: 2.6.1\r\n- Package Manager: pnpm@8.6.3\r\n- Builder: -\r\n- User Config: css, runtimeConfig, modules, components, API_URL\r\n- Runtime Modules: @nuxtjs/tailwindcss@6.8.0, @pinia/nuxt@0.4.11\r\n- Build Modules: -\r\n------------------------------\r\n\r\n### Reproduction\r\n\r\nhttps://codesandbox.io/p/github/s1kebeats/s1kebeats_client/issue\r\n\r\n### Describe the bug\r\n\r\n[AppLogo](https://github.com/s1kebeats/s1kebeats_client/blob/dev/components/ui/AppLogo/AppLogo.vue) component import works in [form.vue](https://github.com/s1kebeats/s1kebeats_client/blob/dev/layouts/form.vue), but doesn't work in [AppHeader](https://github.com/s1kebeats/s1kebeats_client/blob/dev/components/modules/AppHeader/AppHeader.vue). Imports are absolutely identical.\r\n\r\n**Error:**\r\n```\r\n[Vue warn]: Failed to resolve component: AppLogo\r\nIf this is a native custom element, make sure to exclude it from component resolution via compilerOptions.isCustomElement.\r\n```\r\n\r\n[Search](https://github.com/s1kebeats/s1kebeats_client/blob/dev/components/modules/AppHeader/components/Search/Search.vue) component import in [AppHeader](https://github.com/s1kebeats/s1kebeats_client/blob/dev/components/modules/AppHeader/AppHeader.vue) doesn't work too.\r\n\r\n**Error:**\r\n```\r\n[Vue warn]: Failed to resolve component: Search\r\n[1] If this is a native custom element, make sure to exclude it from component resolution via compilerOptions.isCustomElement.\r\n```\r\n\r\nYou can visit `/register` route to see the import working in [form.vue](https://github.com/s1kebeats/s1kebeats_client/blob/dev/layouts/form.vue) and visit `/` route to see the import not working in [AppHeader](https://github.com/s1kebeats/s1kebeats_client/blob/dev/components/modules/AppHeader/AppHeader.vue).\r\n\r\n\r\n### Additional context\r\n\r\nI also have this in logs:\r\n\r\n`[Vue Router warn]: No match found for location with path \"/_nuxt/node_modules/.cache/vite/client/deps/\"`\r\n\r\n### Logs\r\n\r\n```shell-script\r\n[Vue Router warn]: No match found for location with path \"/_nuxt/node_modules/.cache/vite/client/deps/\"\r\n[Vue warn]: Failed to resolve component: AppLogo\r\nIf this is a native custom element, make sure to exclude it from component resolution via compilerOptions.isCustomElement.\r\n[Vue warn]: Failed to resolve component: Search\r\nIf this is a native custom element, make sure to exclude it from component resolution via compilerOptions.isCustomElement.\r\n```",[3113,3114],{"name":3040,"color":3041},{"name":3043,"color":3044},22857,"Valid imports fail in one specific component","2023-08-28T05:18:12Z","https://github.com/nuxt/nuxt/issues/22857",0.65349555,{"labels":3121,"number":3130,"owner":3029,"repository":3029,"state":3049,"title":3131,"updated_at":3132,"url":3133,"score":3134},[3122,3123,3124,3127],{"name":3040,"color":3041},{"name":3020,"color":3021},{"name":3125,"color":3126},"components","05B979",{"name":3128,"color":3129},"❗ p4-important","D93F0B",13538,"Autoimport components dir","2023-10-06T09:49:35Z","https://github.com/nuxt/nuxt/issues/13538",0.6536725,{"description":3136,"labels":3137,"number":3138,"owner":3029,"repository":3029,"state":3049,"title":3139,"updated_at":3140,"url":3141,"score":3142},"### Environment\n\n------------------------------\r\n- Operating System: `Darwin`\r\n- Node Version: `v14.15.4`\r\n- Nuxt Version: `3-3.0.0-27237089.3e38eb8`\r\n- Package Manager: `npm`\r\n- Bundler: `Webpack`\r\n- User Config: `target`, `srcDir`, `css`, `plugins`, `components`, `build`\r\n- Runtime Modules: `-`\r\n- Build Modules: `-`\r\n------------------------------\n\n### Describe the bug\n\nNot sure if it's a breaking change or only currently not implemented. In my projects I configure auto-import like this for example\r\n\r\n```ts\r\n// nuxt.config.ts\r\ncomponents: [\r\n '~/components',\r\n '~/components/base',\r\n ],\r\n```\r\n\r\nBut when I use components of `base` without prefixing them, I'll get errors like \r\n```\r\n[Vue warn]: Failed to resolve component: Button\r\n```\r\n\r\nUsing it as `BaseButton` indeed still works.\n\n### Reproduction\n\nTo be added, if I know it's not a known breaking change.\n\n### Additional context\n\n_No response_\n\n### Logs\n\n```shell\nIf this is a native custom element, make sure to exclude it from component resolution via compilerOptions.isCustomElement.\r\nServer Side Rendering Error: TypeError: Invalid value used as weak map key\r\n at WeakMap.set (\u003Canonymous>)\r\n at normalizePropsOptions (xxx/node_modules/@vue/runtime-core/dist/runtime-core.cjs.js:2673:11)\r\n at createComponentInstance (xxx/node_modules/@vue/runtime-core/dist/runtime-core.cjs.js:6099:23)\r\n at renderComponentVNode (xxx/node_modules/@vue/server-renderer/dist/server-renderer.cjs.js:197:22)\r\n at Module.ssrRenderComponent (xxx/node_modules/@vue/server-renderer/dist/server-renderer.cjs.js:623:12)\r\n at _sfc_ssrRender (file://xxx/.nuxt/dist/server/server.mjs:1968:31)\r\n at renderComponentSubTree (xxx/node_modules/@vue/server-renderer/dist/server-renderer.cjs.js:263:13)\r\n at renderComponentVNode (xxx/node_modules/@vue/server-renderer/dist/server-renderer.cjs.js:214:16)\r\n at renderVNode (xxx/node_modules/@vue/server-renderer/dist/server-renderer.cjs.js:304:22)\r\n at renderComponentSubTree (xxx/node_modules/@vue/server-renderer/dist/server-renderer.cjs.js:269:13)\n```\n",[],12180,"Auto import components nested folders","2023-01-19T15:59:15Z","https://github.com/nuxt/nuxt/issues/12180",0.6551776,{"description":3136,"labels":3144,"number":3145,"owner":3029,"repository":3029,"state":3049,"title":3139,"updated_at":3146,"url":3147,"score":3142},[],12314,"2023-01-19T16:02:56Z","https://github.com/nuxt/nuxt/issues/12314",["Reactive",3149],{},["Set"],["ShallowReactive",3152],{"$fTRc1wZytZ_XrK4EfJfei_Sz-An4H4Yy6syhVxH_PVJc":-1,"$fqmBFDabvf_KeyyTdYGh0T7Ha_QLAJGIwW9I-gIdtzCc":-1},"/nuxt/ui/3039"]