\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?",[2865],{"name":2866,"color":2867},"enhancement","a2eeef",75,"nuxt","icon","open","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.6857724,{"description":2877,"labels":2878,"number":2880,"owner":2869,"repository":2881,"state":2871,"title":2882,"updated_at":2883,"url":2884,"score":2885},"### 🆒 Your use case\n\nI beleive this is a Nuxt edge case for .env, but end user needs to specify an empty key for the .env override to do anything, i.e:\r\n\r\n```ts\r\nexport default defineNuxtConfig({\r\n scripts: {\r\n registry: {\r\n googleAnalytics: true,\r\n }\r\n },\r\n // you need to provide a runtime config to access the environment variables\r\n runtimeConfig: {\r\n public: {\r\n scripts: {\r\n googleAnalytics: {\r\n // .env\r\n // NUXT_PUBLIC_SCRIPTS_GOOGLE_ANALYTICS_ID=\u003Cyour-id>\r\n id: '',\r\n },\r\n },\r\n },\r\n },\r\n})\r\n```\r\n\r\n\n\n### 🆕 The solution you'd like\n\nWe should try and see if we can drop the need for this runtimeConfig as it's quite verbose.\r\n\n\n### 🔍 Alternatives you've considered\n\n_No response_\n\n### ℹ️ Additional info\n\n_No response_",[2879],{"name":2866,"color":2867},239,"scripts","Drop need to specify the runtime config when using .env","2024-09-03T15:49:47Z","https://github.com/nuxt/scripts/issues/239",0.70125866,{"description":2887,"labels":2888,"number":1999,"owner":2869,"repository":2870,"state":2871,"title":2889,"updated_at":2890,"url":2891,"score":2892},"this is not a bug just a simple question I am using vite + nuxt3 + vuetify3 my object is to use it. I am new to nuxt-icon please bare with me. I had following questions please answer it\r\n01 nuxt-icon has tree shaking feature I mean it will only import those icons which are used in code\r\n02 If I want to use mdi:alarm-light inside vuetify \u003Cv-icon icon=\"mdi:alarm-light\">\u003C/v-icon> it should work as I have access to material Icon library right but it fails to display the icon.\r\n```\r\n// nuxt.config.ts\r\n//import { defineNuxtConfig } from 'nuxt'\r\n\r\n// https://nuxt.com/docs/api/configuration/nuxt-config\r\nexport default defineNuxtConfig({\r\n css: ['vuetify/lib/styles/main.sass',],\r\n modules: ['nuxt-icon'],\r\n build: {\r\n transpile: ['vuetify'],\r\n },\r\n vite: {\r\n define: {\r\n 'process.env.DEBUG': false,\r\n },\r\n },\r\n})```",[],"how to use it inside vuetify v-icon component","2023-01-10T13:41:27Z","https://github.com/nuxt/icon/issues/39",0.72592145,{"description":2894,"labels":2895,"number":2896,"owner":2869,"repository":2870,"state":2871,"title":2897,"updated_at":2898,"url":2899,"score":2900},"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.72677314,{"description":2902,"labels":2903,"number":2904,"owner":2869,"repository":2870,"state":2905,"title":2906,"updated_at":2907,"url":2908,"score":2909},"Following the steps in the document, I expected to use the Icon component to display a custom SVG Icon, but it failed.\r\n\r\nhttps://stackblitz.com/edit/nuxt-icon-playground-t9ezmw?file=app.vue",[],162,"closed","Custom Local Collections invalid","2024-06-12T02:55:17Z","https://github.com/nuxt/icon/issues/162",0.6583689,{"description":2911,"labels":2912,"number":2916,"owner":2869,"repository":2870,"state":2905,"title":2917,"updated_at":2918,"url":2919,"score":2920},"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.",[2913],{"name":2914,"color":2915},"question","d876e3",60,"Why `components/global` exactly?","2023-03-13T14:50:53Z","https://github.com/nuxt/icon/issues/60",0.6898951,{"description":2922,"labels":2923,"number":2931,"owner":2869,"repository":2932,"state":2905,"title":2933,"updated_at":2934,"url":2935,"score":2936},"### Description\n\nHi, in a pure Vue 3 application where I am using Nuxt UI as a plugin in `vite.config`, I have a problem at the client, requests to the api to acquire icons are blocked so the icons do not display, is there any way to access offline / install the icon pack for these icons instead of acquiring them via api request?\n\n### Additional context\n\n_No response_",[2924,2925,2928],{"name":2866,"color":2867},{"name":2926,"color":2927},"v3","49DCB8",{"name":2929,"color":2930},"vue","42b883",4167,"ui","Offline icons in Vite configuration","2025-05-28T21:33:03Z","https://github.com/nuxt/ui/issues/4167",0.701258,{"description":2938,"labels":2939,"number":2880,"owner":2869,"repository":2870,"state":2905,"title":2940,"updated_at":2941,"url":2942,"score":2885},"Our server bundle size is massive caused by nuxt icon. i guess it is because it includes all our svgs files as custom collections.\r\nIs it possible to have custom collections with svg files that are located under the public folder so that they do not get part of the bundle size?\r\nHow would i need to configure this?\r\nAt the moment they cannot be loaded",[],"Custom Collection with svg files unter public folder?","2024-08-21T22:47:28Z","https://github.com/nuxt/icon/issues/239",{"description":2944,"labels":2945,"number":2946,"owner":2869,"repository":2870,"state":2905,"title":2947,"updated_at":2948,"url":2949,"score":2950},"So in my case in nuxt.config.ts i described custom collection \r\nicon: {\r\n customCollections: [\r\n {\r\n prefix: 'elfi',\r\n dir: './assets/icons'\r\n },\r\n ],\r\n}\r\n\r\nif in my directory lies files with EN names - all works fine\r\nif i put there file with cyrillic (for ex RU) name - the nuxt even can't start properly with \"npm run dev\" - blank screen with no errors\r\n\r\nand one else thing - if i make some changes in folder with icons - i need to terminate nuxt and run again \"npm run dev\" to activate changes",[],201,"Seems like @nuxt/icon doesn't understand other language in files name in local icon collection","2024-07-16T20:38:16Z","https://github.com/nuxt/icon/issues/201",0.7016885,{"description":2952,"labels":2953,"number":2946,"owner":2869,"repository":2881,"state":2905,"title":2955,"updated_at":2956,"url":2957,"score":2950},"### 🆒 Your use case\r\n\r\nI would love to use the `ScriptGoogleMaps` component but I dont like the static placeholder. Instead I would like to immediately display the map.\r\n\r\n### 🆕 The solution you'd like\r\n\r\nAdd a prop to disable the placeholder / static map feature entirely.\r\n\r\n### ℹ️ Additional info\r\n\r\nReasons:\r\n- Static Map has a max resolution that is very low and therefor always looks blurry on high dpi screens\r\n- Static Map cant be [styled](https://snazzymaps.com/)\r\n- It takes some time until the scripts are loaded and the map is initialized. Therefor the \"activate map on hover\" doesnt work from a UX perspective",[2954],{"name":2866,"color":2867},"Google Maps: Add option to disabled placeholder","2024-09-03T15:45:42Z","https://github.com/nuxt/scripts/issues/201",["Reactive",2959],{},["Set"],["ShallowReactive",2962],{"$fTRc1wZytZ_XrK4EfJfei_Sz-An4H4Yy6syhVxH_PVJc":-1,"$fclCh1UPiF2NtA7rZApBv_M6XjnfHlA4fwiUaVqHzqb4":-1},"/nuxt/ui/4298"]