\r\n\u003C/template>\r\n```\r\n\r\nWith the component TheNavbar being in your layer.\r\nIf I add\r\n```\r\n components: {\r\n dirs: [\r\n {\r\n path: '~/components/global',\r\n global: true,\r\n },\r\n '~/components',\r\n ],\r\n },\r\n```\r\n\r\nIn the config of my layer so I can use `\u003Ccomponent :is=\"resolveComponent('TheNavbar')\" />`\r\n\r\n\n\n### Describe the bug\n\nThe overall problem is that I have an UI-Kit layer with a lot of components.\r\nAnd in my pages I must call an external API with fetch to retrieve an array of components.\r\nThen I have to use the dynamic \u003Ccomponent :is /> but when I try to globally register my layer components it does not work at all and even when it's not dynamic those layer components are unkwown.\r\n\r\nSo is it a bug?\r\n\r\nWhat would be the best practice to have dynamic component with name fetched from an external API on a page and with all of them registered in a layer?\r\n\r\nThank you all!\n\n### Additional context\n\n_No response_\n\n### Logs\n\n_No response_",[3171,3172,3173,3176,3179],{"name":3148,"color":3149},{"name":3135,"color":3136},{"name":3174,"color":3175},"needs reproduction","FBCA04",{"name":3177,"color":3178},"layers","006B75",{"name":3180,"color":3181},"closed-by-bot","ededed",22704,"Marking Layer Components Global = Failed To Resolve","2023-09-07T01:47:44Z","https://github.com/nuxt/nuxt/issues/22704",0.65755445,{"description":3188,"labels":3189,"number":3191,"owner":3138,"repository":3138,"state":3152,"title":3192,"updated_at":3193,"url":3194,"score":3195},"### Environment\n\nNuxt project info:\n\n- Operating System: Linux\n- Node Version: v20.19.1\n- Nuxt Version: 4.0.3\n- CLI Version: 3.28.0\n- Nitro Version: 2.12.4\n- Package Manager: pnpm@8.15.6\n- Builder: -\n- User Config: modules, compatibilityDate, devtools\n- Runtime Modules: ./module/index.ts\n- Build Modules: -\n\n### Reproduction\n\n[Reproduction](https://stackblitz.com/edit/github-do5fbnqe?file=pkg%2Fpackage.json,pkg%2FPublic.vue,module%2Findex.ts)\n\n```sh\npnpm dev\n```\n\n```sh\nError: [unimport] failed to find \"Private\" imported from \"#components\"\n```\n\nThe reproduction demo consists of a simple nuxt project with a module to register the exported component of a local `pkg` package with `addComponent`. The repo uses pnpm's workspaces to add `pkg` as a dependency. `pkg` exports a `pkg/Public.vue` component.\n\nIn addition, `pkg`'s package.json defines a `#components` import mapping, which is internally used by `pkg/Public.vue`.\n\nIf `\"#components\"` is replaced by something else in the `pkg/Public.vue` and `pkg/package.json` files, the component is correctly registered by the module.\n\n### Describe the bug\n\nNuxt's [components transform plugin](https://github.com/nuxt/nuxt/blob/v4.0.3/packages/nuxt/src/components/plugins/transform.ts#L20) identifies files using the `#components` import to properly inject registered components. However, external packages may define in their package.json a `#components` import mapping for internal use. When nuxt finds `#components` imports in files of such packages, it transforms them assuming nuxt's registered components are imported, which may fail since the package's internal `#components` mapping may not expose registered components names.\n\nThe components transform plugin should detect if a file's package's package.json defines the `#components` import mapping, and assume is used internally, in which case `#components` imports should not be transformed.\n\nI could submit a PR.\n\n### Additional context\n\n(Apart from verifying a package does not define a `#components` import mapping, an option could be added so that packages internally using `#components` are able to define a nuxt's `#components` alias (e.g. `#nuxt-components`) to still have access to nuxt registered components)\n\n### Logs\n\n```shell-script\n\n```",[3190],{"name":3135,"color":3136},33032,"Component imports injection conflict for packages using the `#components` import mapping internally","2025-09-04T10:37:42Z","https://github.com/nuxt/nuxt/issues/33032",0.65981567,{"labels":3197,"number":3208,"owner":3138,"repository":3138,"state":3152,"title":3209,"updated_at":3210,"url":3211,"score":3212},[3198,3199,3202,3205],{"name":3148,"color":3149},{"name":3200,"color":3201},"bug","d73a4a",{"name":3203,"color":3204},"components","05B979",{"name":3206,"color":3207},"❗ p4-important","D93F0B",13538,"Autoimport components dir","2023-10-06T09:49:35Z","https://github.com/nuxt/nuxt/issues/13538",0.6622568,{"description":3214,"labels":3215,"number":3227,"owner":3138,"repository":3138,"state":3152,"title":3228,"updated_at":3229,"url":3230,"score":3231},"### 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_",[3216,3219,3220,3223,3224],{"name":3217,"color":3218},"types","2875C3",{"name":3148,"color":3149},{"name":3221,"color":3222},"workaround available","11376d",{"name":3200,"color":3201},{"name":3225,"color":3226},"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.6636106,{"description":3233,"labels":3234,"number":3239,"owner":3138,"repository":3138,"state":3152,"title":3240,"updated_at":3241,"url":3242,"score":3243},"### Environment\n\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: devtools\r\n- Runtime Modules: -\r\n- Build Modules: -\r\n------------------------------\n\n### Reproduction\n\nhttps://stackblitz.com/edit/github-jzao4p?file=modules%2Fsome-module%2Findex.ts\n\n### Describe the bug\n\nThe reproduction contains a nuxt module that adds 2 components. `DComp` that is exported as `default` and `NComp` that is exported as named `NComp`. When registering these components as client-only via `addComponent` the `DComp` works correctry. However `NComp` is apparently not found.\n\n### Additional context\n\n_No response_\n\n### Logs\n\n```shell-script\n[Vue warn]: Invalid vnode type when creating vnode: undefined.\r\n[Vue warn]: Component \u003CAnonymous> is missing template or render function.\n```\n",[3235,3236,3237],{"name":3148,"color":3149},{"name":3200,"color":3201},{"name":3238,"color":3175},"🔨 p3-minor",25281,"Cannot register named exported components as client-only","2024-01-20T20:43:13Z","https://github.com/nuxt/nuxt/issues/25281",0.6637055,{"description":3245,"labels":3246,"number":3250,"owner":3138,"repository":3138,"state":3152,"title":3251,"updated_at":3252,"url":3253,"score":3254},"Hi there!\r\n\r\nI just experiencing an issue that `global components` that defined in `plugins/` directory doesn't seems to work on production build.\r\n\r\n\r\n\r\n> left : build & run on production mode\r\n> right : run development server\r\n\r\nI've assure that this issue only happened on client side rendering because i've check the server side rendering seems to work just fine.\r\n\r\n\r\n\r\nThe global component `\u003Capp-main />` is registered on `/plugins/global-components.js` file here\r\n\r\n\r\n\r\nand here my `nuxt.config.js` file\r\n\r\n```js\r\n'use strict'\r\n\r\nconst { resolve } = require('path')\r\nconst Env = use('Env')\r\n\r\nmodule.exports = {\r\n build: {\r\n publicPath: Env.get('CDN_URL', '/'),\r\n\r\n analyze: {\r\n analyzerMode: 'static',\r\n generateStatsFile: true,\r\n statsFilename: 'webpack-stats.json'\r\n },\r\n\r\n extractCSS: true,\r\n\r\n postcss: {\r\n plugins: {\r\n 'postcss-custom-properties': false\r\n }\r\n }\r\n },\r\n\r\n css: [\r\n '~assets/scss/main.scss'\r\n ],\r\n\r\n head: {\r\n htmlAttrs: {},\r\n\r\n meta: [\r\n {\r\n charset: 'utf-8'\r\n },\r\n {\r\n name: 'viewport',\r\n content: 'width=device-width,initial-scale=1'\r\n },\r\n {\r\n 'http-equiv': 'x-ua-compatible',\r\n content: 'ie=edge,chrome=1'\r\n },\r\n {\r\n name: 'theme-color',\r\n content: '#ffffff'\r\n }\r\n ],\r\n\r\n link: [\r\n {\r\n rel: 'shortcut icon',\r\n type: 'image/x-icon',\r\n href: '/favicon.ico'\r\n },\r\n {\r\n rel: 'apple-touch-icon',\r\n size: '192x192',\r\n href: '/mobile-icon.png'\r\n },\r\n {\r\n rel: 'icon',\r\n type: 'image/png',\r\n size: '192x192',\r\n href: '/mobile-icon.png'\r\n },\r\n {\r\n rel: 'icon',\r\n type: 'image/png',\r\n size: '32x32',\r\n href: '/favicon.png'\r\n },\r\n {\r\n rel: 'stylesheet',\r\n href: 'https://fonts.googleapis.com/css?family=Montserrat:300,400,600'\r\n }\r\n ],\r\n\r\n noscript: [{\r\n innerHtml: `\r\n \u003Ch1>Javascript Disabled\u003C/h1>\r\n \u003Cp>It appears that you do not have Javascript enabled. This application relies on Javascript for most of our features.\u003Cp>\r\n \u003Cp>Please enable Javascript and \u003Ca href=\".\">reload\u003C/a> in order to use this site.\u003C/p>\r\n `}]\r\n },\r\n\r\n loading: {\r\n color: '#589d8d'\r\n },\r\n\r\n plugins: [\r\n '~/plugins/global-components.js'\r\n ],\r\n\r\n router: {\r\n base: '/',\r\n linkActiveClass: '',\r\n linkExactActiveClass: 'is-active',\r\n\r\n scrollBehaviour: () => ({\r\n x: 0,\r\n y: 0\r\n }),\r\n\r\n extendRoutes: (routes) => {\r\n routes.forEach((route) => {\r\n route.meta = {\r\n title: route.name\r\n }\r\n })\r\n }\r\n },\r\n\r\n buildDir: resolve(__dirname, '..', 'public'),\r\n srcDir: resolve(__dirname, '..', 'resources')\r\n}\r\n```\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/c2492\">#c2492\u003C/a>)\u003C/em>\u003C/sub>\u003C/div>",[3247],{"name":3248,"color":3249},"2.x","d4c5f9",2868,"global components non rendered properly on production build?","2023-01-18T16:09:43Z","https://github.com/nuxt/nuxt/issues/2868",0.66819525,{"description":3256,"labels":3257,"number":3260,"owner":3138,"repository":3138,"state":3152,"title":3261,"updated_at":3262,"url":3263,"score":3264},"### Environment\n\n------------------------------\r\n- Operating System: `Linux`\r\n- Node Version: `v19.4.0`\r\n- Nuxt Version: `3.3.2`\r\n- Nitro Version: `2.3.2`\r\n- Package Manager: `pnpm@7.25.0`\r\n- Builder: `vite`\r\n- User Config: `-`\r\n- Runtime Modules: `-`\r\n- Build Modules: `-`\r\n------------------------------\n\n### Reproduction\n\nI can't really figure out the best way to expose a \"minimal\" reproduction. The issue relies on a dependency. \r\nYou can view the code that I'm using to addComponent here -> https://github.com/VividLemon/bootstrap-vue-next/blob/main/packages/nuxt/src/composables/useComponents.ts\r\n\r\n& The whole package -> https://github.com/VividLemon/bootstrap-vue-next/tree/main/packages/nuxt\r\n\r\n\n\n### Describe the bug\n\nThe playground dev environment works fine. However, when trying to run `pnpm prepack`, the library throws: \r\n```\r\nNamed export 'Components' not found. The requested module 'bootstrap-vue-next' is a CommonJS module, which may not support all module.exports as named exports. 20:54:27\r\nCommonJS modules can always be imported via the default export, for example using:\r\n```\r\nThis is a bit strange as the dist exposes umd.js & es.js files. I'm not certain why it would be attempting to use the CommonJs module specifically, but maybe it's because JS module resolution confuses me.\r\n\r\nThe suggestion, \r\n```\r\nimport pkg from 'bootstrap-vue-next';\r\n const { Components } = pkg;\r\n```\r\nDoesn't quite work as the file has a default export. So 'pkg' in this case doesn't provide pkg.Components. It might do something, but it doesn't show intellisense that it exists.\r\n\r\nI believe the issue stems from when Nuxt is compiling the cjs variant. As the dist/mjs file is made and seemingly works fine.\r\n\r\nI'm not quite sure how to fix the issue. It's more likely that I am doing something wrong here and it's not a @nuxt/kit issue. Any insight on fixing the issue would be appreciated. \n\n### Additional context\n\n_No response_\n\n### Logs\n\n_No response_",[3258,3259],{"name":3148,"color":3149},{"name":3135,"color":3136},19974,"Nuxt module addComponent from a dependency import results in `The requested module is a CommonJS module`","2023-03-29T17:54:05Z","https://github.com/nuxt/nuxt/issues/19974",0.6728012,["Reactive",3266],{},["Set"],["ShallowReactive",3269],{"$fTRc1wZytZ_XrK4EfJfei_Sz-An4H4Yy6syhVxH_PVJc":-1,"$frIhWqRPsSqrlSmSNELlEEIJ7IJ6nPJ9GJNknlX-utbc":-1},"/nuxt/nuxt/26471"]