component as \u003CNuxtIcon.../> or \u003CBaseIcon.../> instead by default. \r\n\r\nAre these alternate component name already available as aliases when using the nuxt-icon module?",[],58,"closed","Suggestion: Icon -> NuxtIcon or BaseIcon","2023-03-14T21:38:49Z","https://github.com/nuxt/icon/issues/58",0.5961624,{"description":3036,"labels":3037,"number":3038,"owner":3019,"repository":3020,"state":3030,"title":3039,"updated_at":3040,"url":3041,"score":3042},"Hi,\n\nI’ve searched high and low and didn’t find this covered anywhere, apologies if this has been addressed already.\n\nI am using @nuxt/icon with @iconify and the VS Code Intellisense plugin, works great.\n\nI have a custom component that I would like to pass autocompleted string values to, something like:\n\n```html\n\u003CHighlight\n icon-name=\"...\"\n\u003C!-- ^ This should suggest values such as \"bxs:success\" etc, same as the \u003CIcon> component directly -->\n```\n\nI tried this:\n\n```ts\n// Highlight.vue\n\nimport type { ExtractPublicPropTypes } from 'vue';\nimport { Icon } from '#components';\ntype IconName = ExtractPublicPropTypes\u003Ctypeof Icon['name']>\n\nconst props = defineProps\u003C{\n iconName: IconName\n}>()\n```\n\nI get a vague `{} & {}` as the resulting type. Any help appreciated!",[],412,"Infer \u003CIcon> \"name\" as prop to be used in a custom component","2025-07-02T09:24:15Z","https://github.com/nuxt/icon/issues/412",0.63929534,{"description":3044,"labels":3045,"number":104,"owner":3019,"repository":3020,"state":3030,"title":3049,"updated_at":3050,"url":3051,"score":3052},"I know `\u003CIcon>` is much sexier than `\u003CNuxtIcon>` or `\u003CNIcon>` but maybe in order to avoid conflicting we can prefix component name too?",[3046],{"name":3047,"color":3048},"enhancement","a2eeef","Using two part component name","2022-09-07T13:21:28Z","https://github.com/nuxt/icon/issues/3",0.64731133,{"description":3054,"labels":3055,"number":3056,"owner":3019,"repository":3020,"state":3030,"title":3057,"updated_at":3058,"url":3059,"score":3060},"Although it looks redundant, Iconify uses `\u003CIcon icon=\"...\" />` as the Vue component. Since this module uses Iconify, why not keeping the same structure so we can just copy the component from their lib? An alias prop would be welcomed if I'm sounding too radical 😋 That way we can use both `name` and `icon`.",[],51,"[question] Why not using `icon` as a prop instead of `name`?","2023-02-16T15:53:34Z","https://github.com/nuxt/icon/issues/51",0.6588341,{"description":3062,"labels":3063,"number":3067,"owner":3019,"repository":3020,"state":3030,"title":3068,"updated_at":3069,"url":3070,"score":3071},"Can't we define where we'll be storing those custom icon components in our project?\r\nThis sounds more sane `components/icons`... I looked at the source, but I found nothing that defines this path.\r\n\r\nSo could be that I'm blind, or this `global` directory is something that Nuxt handles?\r\n\r\nKind regards.",[3064],{"name":3065,"color":3066},"question","d876e3",60,"Why `components/global` exactly?","2023-03-13T14:50:53Z","https://github.com/nuxt/icon/issues/60",0.6691283,{"description":3073,"labels":3074,"number":3075,"owner":3019,"repository":3020,"state":3030,"title":3076,"updated_at":3077,"url":3078,"score":3079},"Installed following the steps [here](https://nuxt.com/modules/icon).\r\n```\r\nnpm install --save-dev nuxt-icon\r\n```\r\nAdded to my `nuxt.config.ts`\r\n```\r\n modules: [\r\n // https://go.nuxtjs.dev/bootstrap\r\n 'bootstrap-vue/nuxt',\r\n // https://go.nuxtjs.dev/pwa\r\n '@nuxtjs/pwa',\r\n // https://go.nuxtjs.dev/content\r\n '@nuxt/content',\r\n // https://nuxt.com/modules/icon\r\n 'nuxt-icon'\r\n ],\r\n```\r\nUsed on a component\r\n```\r\n\u003CIcon name=\"logos:instagram-icon\" />\r\n```\r\n\r\nThe page rendered without the icon and got this on the console.\r\n```\r\n[Vue warn]: Unknown custom element: \u003CIcon> - did you register the component correctly? For recursive components, make sure to provide the \"name\" option.\r\n\r\nfound in\r\n\r\n---> \u003CLayouts/default.vue> at layouts/default.vue\r\n \u003CRoot>\r\n```\r\n\r\n### My dependencies\r\n```\r\n \"dependencies\": {\r\n \"@nuxt/content\": \"^1.0.0\",\r\n \"@nuxtjs/pwa\": \"^3.3.5\",\r\n \"bootstrap\": \"^4.6.2\",\r\n \"bootstrap-vue\": \"^2.22.0\",\r\n \"bootswatch\": \"^5.2.3\",\r\n \"core-js\": \"^3.25.3\",\r\n \"nuxt\": \"^2.15.8\",\r\n \"nuxt-icon\": \"^0.4.0\",\r\n \"vue\": \"^2.7.10\",\r\n \"vue-server-renderer\": \"^2.7.10\",\r\n \"vue-template-compiler\": \"^2.7.10\"\r\n },\r\n \"devDependencies\": {\r\n \"@babel/eslint-parser\": \"^7.19.1\",\r\n \"@nuxtjs/eslint-config\": \"^11.0.0\",\r\n \"@nuxtjs/eslint-module\": \"^3.1.0\",\r\n \"eslint\": \"^8.24.0\",\r\n \"eslint-plugin-nuxt\": \"^4.0.0\",\r\n \"eslint-plugin-vue\": \"^9.5.1\",\r\n \"sass\": \"^1.62.1\",\r\n \"sass-loader\": \"^10.4.1\"\r\n }\r\n```",[],74,"Unknown custom element: \u003CIcon> - did you register the component correctly?","2023-08-07T11:42:06Z","https://github.com/nuxt/icon/issues/74",0.67706347,{"description":3081,"labels":3082,"number":659,"owner":3019,"repository":3020,"state":3030,"title":3083,"updated_at":3084,"url":3085,"score":3086},"Is it possible to change the `/components/global` directory. I have checked the code of this module, but it seems to me that it could be something that's inside Nuxt 3?\r\n\r\nProposition:\r\n```js\r\n nuxtIcon: {\r\n size: \"16px\",\r\n source: '~/components/icons' // or an array with multiple values\r\n },\r\n```",[],"Feature: Possible to change the icons directory","2023-01-19T16:59:35Z","https://github.com/nuxt/icon/issues/18",0.680205,{"description":3088,"labels":3089,"number":3099,"owner":3019,"repository":3019,"state":3030,"title":3100,"updated_at":3101,"url":3102,"score":3103},"### Environment\n\n- Operating System: Linux\r\n- Node Version: v16.14.2\r\n- Nuxt Version: 3.5.0\r\n- Nitro Version: 2.4.1\r\n- Package Manager: npm@7.17.0\r\n- Builder: vite\r\n- User Config: -\r\n- Runtime Modules: -\r\n- Build Modules: -\n\n### Reproduction\n\nhttps://stackblitz.com/edit/github-jblieu-fynag4\n\n### Describe the bug\n\nNuxt can no longer resolve a component if its name starts with its containing folder's name, ex:\r\n\r\ncomponent path: `components/Icon/Icones`\r\n\r\napp.vue:\r\n```vue\r\n\u003Ctemplate>\r\n \u003Cdiv>\r\n \u003CIconIcones />\r\n \u003C/div>\r\n\u003C/template>\r\n```\r\n\r\nconsole output:\r\n```sh\r\n[Vue warn]: Failed to resolve component: IconIcones 21:27:18\r\nIf this is a native custom element, make sure to exclude it from component resolution via compilerOptions.isCustomElement.\r\n```\n\n### Additional context\n\nThe above example works in Nuxt 3.4.x\n\n### Logs\n\n_No response_",[3090,3093,3096],{"name":3091,"color":3092},"3.x","29bc7f",{"name":3094,"color":3095},"bug","d73a4a",{"name":3097,"color":3098},"🔨 p3-minor","FBCA04",20937,"Regression: Cannot resolve component if its folder's name is a prefix of the component's name","2023-05-19T11:23:25Z","https://github.com/nuxt/nuxt/issues/20937",0.68431735,{"labels":3105,"number":3110,"owner":3019,"repository":3019,"state":3030,"title":3111,"updated_at":3112,"url":3113,"score":3114},[3106,3109],{"name":3107,"color":3108},"documentation","5319e7",{"name":3091,"color":3092},11968,"docs: explain component name resolution","2023-01-19T16:03:39Z","https://github.com/nuxt/nuxt/issues/11968",0.686885,["Reactive",3116],{},["Set"],["ShallowReactive",3119],{"$fTRc1wZytZ_XrK4EfJfei_Sz-An4H4Yy6syhVxH_PVJc":-1,"$fevMmO9_GMgpV3GFZ655gmArUE9uuHXEjsdvoqdfAkFE":-1},"/nuxt/icon/174"]