\r\n Loading\r\n \u003C/div>\r\n \u003C/template>\r\n \u003Cdiv class=\"content\" ref=\"someRef\">\r\n This text should NOT be large!\r\n Remove the \u003Cpre>ref=\"someRef\"\u003C/pre> from the parent and it works\r\n \u003C/div>\r\n \u003C/ClientOnly>\r\n\u003C/template>\r\n```\r\n\r\n**Expected behaviour when loading the page:**\r\nA big loading spinner, and, when everything is done loading, some normal text, like this:\r\n\r\n\r\n**Instead,** you get this:\r\n\r\n\r\nWhen you remove the `ref=\"someRef\"` from the content div, it works as expected",[],"nuxt","icon","open","Unexpected behaviour when using an Icon within ClientOnly fallback","2023-12-18T12:08:48Z","https://github.com/nuxt/icon/issues/129",0.7034565,{"description":2873,"labels":2874,"number":2881,"owner":2865,"repository":2865,"state":2867,"title":2882,"updated_at":2883,"url":2884,"score":2885},"### Environment\n\n- Operating System: `Linux`\r\n- Node Version: `v16.14.2`\r\n- Nuxt Version: `3.0.0-rc.8`\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-pq8nym?file=app.vue\n\n### Describe the bug\n\nIf you have an image referencing a dynamic asset, e.g.\r\n```vue\r\n\u003Ctemplate>\r\n \u003Cimg :src=\"`~/assets/${dynamic_image_name}`\" alt=\"Discover Nuxt 3\" />\r\n\u003C/template>\r\n\u003Cscript setup lang=\"ts\">\r\nconst dynamic_image_name = 'zero-config.svg';\r\n\u003C/script>\r\n```\r\n\r\nthen this is rendered as \r\n```html\r\n\u003Cimg src=\"~/assets/zero-config.svg\" alt=\"Discover Nuxt 3\">\r\n```\r\nwithout correctly resolving (and copying) the image, thus it doesn't show in the browser.\n\n### Additional context\n\nRefs https://github.com/nuxt/framework/pull/6635.\n\n### Logs\n\n_No response_",[2875,2878],{"name":2876,"color":2877},"documentation","5319e7",{"name":2879,"color":2880},"dx","C39D69",14766,"Assets with dynamic names are not resolved","2025-01-11T09:07:17Z","https://github.com/nuxt/nuxt/issues/14766",0.7180079,{"description":2887,"labels":2888,"number":2889,"owner":2865,"repository":2866,"state":2867,"title":2890,"updated_at":2891,"url":2892,"score":2893},"I want to share common icons between projects using nuxt layers. I would prefer to keep my icons in svg files. Unfortunately, the `nuxt-icons` module does not meet my expectations (import all icons), so I decided to use your solution.\r\n\r\nWhen I hold the icon in `/components/global` everything works great. Unfortunately, when I keep this icon in a nuxt layer, I get a string with the name instead of the icon.\r\n\r\nI would also love to be able to use `param-case` in the `name` property.\r\n\r\nReproduction: https://stackblitz.com/edit/github-qddkmm?file=base/nuxt.config.ts",[],48,"Can't use svg icons from nuxt layer","2024-05-07T08:36:47Z","https://github.com/nuxt/icon/issues/48",0.7345386,{"description":2895,"labels":2896,"number":2900,"owner":2865,"repository":2866,"state":2867,"title":2901,"updated_at":2902,"url":2903,"score":2904},"Hi there, thanks for the cool module.\r\n\r\nI was wondering if it is possible to nest custom SVG icons inside folders? \r\n\r\n**Editing OP to make it more clear:**\r\n\r\n--- \r\n\r\nAfter some experimenting with the playground in the repo I understand the intended pattern now.\r\n\r\n1. Default pattern\r\n\r\n```js\r\n// Assuming: `components/global/MyIcon.vue`\r\n\r\n\u003CIcon name=\"MyIcon\" /> \r\n```\r\n\r\n2. If you want to have `\u003CIcon>` load an **SFC** that is nested in folders - that's easy:\r\n\r\n```js\r\n// Assuming: `components/global/CoolStuff/MyIcon.vue`\r\n\r\n\u003CIcon name=\"CoolStuffMyIcon\" /> \r\n```\r\n\r\n3. However, if you have an elaborate set of custom icons (`.svg` extension) that are organized in folders, you would currently need an individual `.vue` icon to go along with every single one.\r\n\r\n```js\r\n// Assuming: `{public|assets}/icons/brand/MyIcon.svg\r\n// Assuming: `components/global/icons/brand/MyIcon.vue`\r\n\r\n// Assuming: `{public|assets}/icons/brand/MyOtherIcon.svg\r\n// Assuming: `components/global/icons/brand/MyOtherIcon.vue`\r\n\r\n\u003CIcon name=\"IconsBrandMyIcon\" />\r\n\u003CIcon name=\"IconsBrandMyOtherIcon\" />\r\n\r\n// etc.\r\n```\r\n\r\nThis means you need to manage a folder of SVGs as well as their matching SFCs. \r\n\r\nIs there a solution?",[2897],{"name":2898,"color":2899},"enhancement","a2eeef",75,"Feature request: A way to manage custom SVGs that are nested inside folders.","2023-08-07T11:42:42Z","https://github.com/nuxt/icon/issues/75",0.73941743,{"description":2906,"labels":2907,"number":2908,"owner":2865,"repository":2866,"state":2909,"title":2910,"updated_at":2911,"url":2912,"score":2913},"\r\nHello, \r\nThanks for this wonderful module that makes it easier to use icons seamlessly in Nuxt.\r\nThere is need to fix the typo for **icon** under the _**attributes**_ section.",[],98,"closed","Typo in readme","2023-08-17T10:45:48Z","https://github.com/nuxt/icon/issues/98",0.71151435,{"description":2915,"labels":2916,"number":2908,"owner":2865,"repository":2917,"state":2909,"title":2918,"updated_at":2919,"url":2920,"score":2913},"I am using the new nuxt/scripts module and a little confused. I want to enable the lemonsqueezy script globally, I have multiple pages where this is needed. How should I do this? the [docs](https://scripts.nuxt.com/scripts/payments/lemon-squeezy#example) tell me to do the below and I added this in my `app.vue`\r\n\r\n```html\r\n\u003Cscript setup>\r\nconst { Setup } = useScriptLemonSqueezy();\r\nonMounted(() => {\r\n Setup();\r\n});\r\n\u003C/script>\r\n```\r\n\r\nWhats happening\r\n\r\n1. `index.vue` pages opens the checkout overlay\r\n2. `[...productId].vue` pages open the checkout overlay if I open the page directly, but not when I navigate to this page from a `\u003CNuxtLink />` \r\n\r\nI thought this was an issue with the lemon.js script, but when I navigate to the product page from a NuxtLink, I can see `window.LemonSqueezy` has a been initiated which is confusing me even further, everything is working from both parties yet the checkout wont open in the overlay.\r\n\r\nHere's a repro - https://stackblitz.com/edit/github-zk9jpe?file=pages%2Findex.vue",[],"scripts","Weird behaviour with lemonsqueezy script from registry","2024-07-06T11:13:23Z","https://github.com/nuxt/scripts/issues/98",{"description":2922,"labels":2923,"number":2933,"owner":2865,"repository":2865,"state":2909,"title":2934,"updated_at":2935,"url":2936,"score":2937},"\n### Environment\n\nNuxt project info: \n\n------------------------------\n- Operating System: Linux\n- Node Version: v20.15.1\n- Nuxt Version: 3.13.2\n- CLI Version: 3.13.2\n- Nitro Version: 2.9.7\n- Package Manager: bun@1.1.8\n- Builder: -\n- User Config: experimental, runtimeConfig, build, devtools, nitro, routeRules, plugins, modules, eslint, pinia, site, delayHydration, i18n, icon, app, content, svgo, sitemap, googleFonts, image, mdc, htmlValidator, compatibilityDate\n- Runtime Modules: @nuxt/ui@2.18.4, @nuxt/image@1.8.0, @nuxt/content@2.13.2, @nuxt/eslint@0.5.7, @nuxtjs/google-fonts@3.2.0, @nuxtjs/fontaine@0.4.3, @nuxtjs/i18n@8.5.5, @nuxtjs/mdc@0.8.3, @nuxtjs/sitemap@6.1.0, @nuxtjs/html-validator@1.8.2, nuxt-delay-hydration@1.3.8, nuxt-svgo@4.0.6, @vueuse/nuxt@11.1.0, @vueuse/motion/nuxt@2.2.5, @pinia/nuxt@0.5.4, @nuxthq/studio@2.0.3, @nuxt/icon@1.5.1, @formkit/auto-animate/nuxt@0.8.2\n- Build Modules: -\n------------------------------\n\n### Reproduction\n\nGithub to reproduction: https://github.com/hoachnt/hoachnt-web\n\n### Describe the bug\n\nI don't know what problem is. I try to fix this bug 2 months and think that problem is in nuxt. And yep I saw in the official website of nuxt has same problem\n\n### Additional context\n\n_No response_\n\n### Logs\n\n_No response_",[2924,2927,2930],{"name":2925,"color":2926},"pending triage","E99695",{"name":2928,"color":2929},"needs reproduction","FBCA04",{"name":2931,"color":2932},"possible regression","B90A42",29387,"Icons not rendering on production build when mounting","2024-10-15T06:27:30Z","https://github.com/nuxt/nuxt/issues/29387",0.7260484,{"description":2939,"labels":2940,"number":382,"owner":2865,"repository":2866,"state":2909,"title":2941,"updated_at":2942,"url":2943,"score":2944},"I am using this module and when I use it with RC10s full static mode. It does not render the icon, adds the icon name as a string.\r\n\r\n\r\n\r\nAs you can see, it is just using the fallback as the icon name instead of rendering the svg `\u003Cspan v-else class=\"icon\" :style=\"{ fontSize: sSize, lineHeight: sSize, width: sSize, height: sSize }\">{{ name }}\u003C/span>`\r\n\r\nCC: @Atinux ",[],"Bug: Icons do not render in full static mode in RC10","2022-09-21T08:43:38Z","https://github.com/nuxt/icon/issues/8",0.7268891,{"description":2946,"labels":2947,"number":2948,"owner":2865,"repository":2866,"state":2909,"title":2949,"updated_at":2950,"url":2951,"score":2952},"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.72738236,{"description":2954,"labels":2955,"number":1598,"owner":2865,"repository":2866,"state":2909,"title":2956,"updated_at":2957,"url":2958,"score":2959},"\r\nIcons are not being rendered in the SSR part\r\n\r\n\r\n\r\nSource Code\r\n\r\n\r\nIn the Vue part (client) it works correctly\r\n\r\nnpx nuxi info\r\n`- Operating System: `Linux`\r\n- Node Version: `v18.12.1`\r\n- Nuxt Version: `3.0.0`\r\n- Nitro Version: `1.0.0`\r\n- Package Manager: `npm@8.19.2`\r\n- Builder: `vite`\r\n- User Config: `srcDir`, `modules`, `tailwindcss`, `vite`, `schemaOrg`, `telemetry`, `algolia`, `head`, `auth`, `viewport`, `css`, `build`, `runtimeConfig`\r\n- Runtime Modules: `genesis-design-system/nuxt`, `@nuxtjs/algolia@1.3.1`, `@nuxtjs/tailwindcss@6.1.3`, `formidable@2.1.1`, `@nuxtjs-alt/auth@2.1.6`, `@nuxtjs-alt/http@1.5.4`, `nuxt-viewport@2.0.3`, `@nuxtjs/partytown@1.3.0`, `@vueuse/nuxt@9.6.0`, `@nuxtjs/i18n-edge@8.0.0-beta.4-27812700.b832f07`, `nuxt-schema-org@1.1.0-beta.6`, `nuxt-icon@0.1.8`, `@pinia/nuxt@0.4.6`, `@nuxtjs/i18n@8.0.0-beta.6`\r\n- Build Modules: `-`\r\n`",[],"Icons not render in SSR side (Node)","2022-12-22T11:02:18Z","https://github.com/nuxt/icon/issues/35",0.7292644,["Reactive",2961],{},["Set"],["ShallowReactive",2964],{"$fTRc1wZytZ_XrK4EfJfei_Sz-An4H4Yy6syhVxH_PVJc":-1,"$faUB0zWS2CpKK8bAJLSJwQguXgpgLEhLikk46APphK_4":-1},"/nuxt/icon/78"]