, found can not load this icon\n\n### Description\n\nEarlier versions could inject custom ICONS in this way and display them correctly using I-BV-heart, but this seems to be invalid in the new version. i have seen an interrupt change in the version that mentions migrating from @egoist/tailwindcss-icons to @nuxt/icon library. So can you provide a description of how I should configure the migration in the new version of this scenario\n\n### Additional context\n\n_No response_\n\n### Logs\n\n```shell-script\n\n```",[2036],{"name":1998,"color":1999},3612,"ui","How to inject customer icon","2025-03-20T15:39:12Z","https://github.com/nuxt/ui/issues/3612",0.71922874,{"description":2044,"labels":2045,"number":2053,"owner":1988,"repository":2038,"state":2028,"title":2054,"updated_at":2055,"url":2056,"score":2057},"### Environment\n\n------------------------------\n- Operating System: Darwin\n- Node Version: v20.18.1\n- Nuxt Version: 3.15.0\n- CLI Version: 3.17.2\n- Nitro Version: 2.10.4\n- Package Manager: bun@1.1.42\n- Builder: -\n- User Config: default\n- Runtime Modules: @nuxt/ui-pro@3.0.0-alpha.10, @nuxtjs/i18n@9.1.1\n- Build Modules: -\n------------------------------\n\n### Is this bug related to Nuxt or Vue?\n\nNuxt\n\n### Version\n\nV3.0.0-alpha.10\n\n### Reproduction\n\nhttps://codesandbox.io/p/devbox/nuxt-ui3-forked-gxx7qs\n\n### Description\n\nWhen using a USelectMenu together with the placeholder or label-key it collides with the slots. The rendered elements are overlapping. \n\n### Additional context\n\n_No response_\n\n### Logs\n\n```shell-script\n\n```",[2046,2047,2050],{"name":1998,"color":1999},{"name":2048,"color":2049},"v3","49DCB8",{"name":2051,"color":2052},"triage","ffffff",3022,"USelectMenu placeholder/selected value collides with slots","2025-04-08T10:26:50Z","https://github.com/nuxt/ui/issues/3022",0.71985257,{"description":2059,"labels":2060,"number":2067,"owner":1988,"repository":1988,"state":2028,"title":2068,"updated_at":2069,"url":2070,"score":2071},"### Version\n\n[v2.8.1](https://github.com/nuxt.js/releases/tag/v2.8.1)\n\n### Reproduction link\n\n[http://empy](http://empy)\n\n### Steps to reproduce\n\n1. create new project with minimum setup (no add any modules / packages) via `create-nuxt-app`.\n2. create new folder at root project named `serverMiddleware`.\n3. create new file inside `serverMiddleware` folder, named `test.middleware.js`. add content (see bottom):\n4. open `nuxt.config.js`. add into `watch` property : `watch: ['serverMiddleware/test.middleware.js']`. Note: `config.watch` not `config.build.watch`\n5. run `yarn dev` to host dev mode, open site in browser and f5 several times. We will see in terminal the console `~this xxx` message.\n6. open `test.middleware.js` and edit string from `~ this` to `~ this edited`. save file. We will see in terminal the server auto restarted.\n7. After restart done, refresh brower and see message changed. Repeat step 6, 7 to make sure server restart no issue.\n8. turn off process (ctrl + c). then open `nuxt.config.js`, edit watch file string from `serverMiddleware/test.middleware.js` to `serverMiddleware/*.js`.\n9. start server by `yarn dev`. refresh browser to see message show on.\n10. repeat step 6, 7. The watcher will failed with trap 6 nodejs report at second restart.\n\n### test.middleware.js\n```js\nexport default {\n handler: function(req, res, next) {\n // req is the Node.js http request object\n console.log('~ this ', req.path)\n\n // res is the Node.js http response object\n\n // next is a function to call to invoke the next middleware\n // Don't forget to call next at the end if your middleware is not an endpoint!\n next()\n }\n}\n```\n\n### What is expected ?\n\nconfig.watch with wildcard should work no issue.\n\n### What is actually happening?\n\nconfig.watch failed when restart second times if watch string contains wildcard syntaxs\n\n### Additional comments?\n\nPs: also i found that serverMiddleware will cache somewhere outside nuxt processing if in `config.serverMiddlware` property we use string file path.\nIf we require middleware file use `require()` inside `nuxt.config.js` then import direct to `config.serverMiddleware` and add file path to `config.watch` then project will listen and restart correctly.\n\n\u003C!--cmty-->\n\u003Cdiv align=\"right\">\u003Csub>\u003Cem>This bug report is available on \u003Ca href=\"https://cmty.app/nuxt\">Nuxt\u003C/a> community (\u003Ca href=\"https://cmty.app/nuxt/nuxt.js/issues/c9642\">#c9642\u003C/a>)\u003C/em>\u003C/sub>\u003C/div>",[2061,2063,2064],{"name":2062,"color":2052},"stale",{"name":1985,"color":1986},{"name":2065,"color":2066},"2.x","d4c5f9",6232,"`config.watch` failed at second restart if use wildcard","2023-01-22T15:34:44Z","https://github.com/nuxt/nuxt/issues/6232",0.7283746,{"description":2073,"labels":2074,"number":2084,"owner":1988,"repository":1988,"state":2028,"title":2085,"updated_at":2086,"url":2087,"score":2088},"### Environment\n\nNuxt project info:\r\n------------------------------\r\n- Operating System: Windows_NT\r\n- Node Version: v18.18.2\r\n- Nuxt Version: 3.9.0\r\n- CLI Version: 3.10.0\r\n- Nitro Version: 2.8.1\r\n- Package Manager: yarn@1.22.19\r\n- Builder: -\r\n- User Config: -\r\n- Runtime Modules: -\r\n- Build Modules: -\r\n------------------------------\n\n### Reproduction\n\n[Basic Live view](https://77fmvd-3000.csb.app/subfolder)\r\n[Code](https://codesandbox.io/p/devbox/nuxt-v3-bug-watch-called-multiple-times-77fmvd)\n\n### Describe the bug\n\nI've created an example with 4 different types of routes:\r\n- 2 routes created with the setup component;\r\n - _One route with `definePageMeta({ key: (route) => route.fullPath });` e one without_\r\n- 2 routes created with the defineNuxtComponent-setup;\r\n - _One route with `definePageMeta({ key: (route) => route.fullPath });` e one without_\r\n\r\nEvery route have the same code (one inside \u003Cscript setup> and one inside defineNuxtComponent-setup):\r\n```js\r\n\r\n const { pending, data: todo } = await useLazyAsyncData(\r\n `define-component-key-todos-${ idSubfolderDefineComponentKey }`,\r\n () => $fetch( `https://jsonplaceholder.typicode.com/todos/${ idSubfolderDefineComponentKey || \"\" }` ),\r\n );\r\n const single = computed(() => todo.value ?? {});\r\n const singleChangedTimes = ref(0);\r\n\r\n console.info(\"todo\", todo.value);\r\n\r\n watch(single, (newSingle, oldSingle) => {\r\n console.info(\"newAndOldSingle\", newSingle, oldSingle);\r\n singleChangedTimes.value++;\r\n });\r\n\r\n```\r\n\r\nFrom this code you can see I'm using the `useLazyAsyncData` that is returning a **Ref** named **todo**.\r\n\r\n\r\nNow, if you navigate the browser and look at the console you can see some different behaviours.\r\n\r\n### Step to reproduce\r\n\r\n- Click on '_Go to idSubfolder - No PageKey - Setup 1_' **for the first time** you can see in the console that there are 2 console log, one empty e one when the watch is called: \r\n- Click on '_\u003C-- Go back_';\r\n- Click again on '_Go to idSubfolder - No PageKey - Setup 1_' (so, for the **second time**) you can see in the console that there are 2 console log, one with the old value (from the previous one) and another one when the watch is called: \r\n- Now you can repeat the same steps for every route type;\r\n- '_Go to idSubfolder - With PageKey - Setup 1_', two info are logged in the console, one on the first click and one on the second: \r\n\r\n\r\n- 🔴 Now, the issue seems to appear if you are trying to follow the same steps on **a page declared with defineNuxtComponent**.\r\n- Click on '_Go to idSubfolder - With PageKey - With Define component 1_' then '_\u003C-- Go back_' and then again on '_Go to idSubfolder - With PageKey - With Define component 1_', you will immediately see that in the console the watch is called multiple times, and it's incremental based on how many times you've entered the same page (here after 4 click on the same page): \r\n\n\n### Additional context\n\nI'm not sure, but this could be a **Memory Leak**.\r\nAnd maybe the problem is related to the **Ref** given by the _useLazyAsyncData_,\r\nbecause the GC is not able to release the memory and the **watch** still have a reference to the previous given value.\r\nThis is why in every page the previous _watch_ is called and a new one is also instantiated.\r\n\r\n> Using `definePageMeta({ key: (route) => route.fullPath });` does not fix the problem.\r\n\r\nI've also added a variable (`singleChangedTimes`) to check how many times the actual **watch** is called, and its value is **always 1**.\r\n\r\n```js\r\n\r\n const { pending, data: todo } = await useLazyAsyncData(\r\n `define-component-key-todos-${ idSubfolderDefineComponentKey }`,\r\n () => $fetch( `https://jsonplaceholder.typicode.com/todos/${ idSubfolderDefineComponentKey || \"\" }` ),\r\n );\r\n const single = computed(() => todo.value ?? {});\r\n const singleChangedTimes = ref(0);\r\n\r\n console.info(\"todo\", todo.value);\r\n\r\n watch(single, (newSingle, oldSingle) => {\r\n console.info(\"newAndOldSingle\", newSingle, oldSingle);\r\n singleChangedTimes.value++;\r\n });\r\n\r\n```\r\n\r\nNote: if you add a `useFetch/$fetch` inside the watch callback, you can see in the _Newtwork Tab_ that you have the same problem and that the _Network Fetch number is incrementing on every page view_.\r\n\r\n\r\nBtw, I'm not a Node memory expert 😄 , so I'm sorry if i said something wrong..\n\n### Logs\n\n_No response_",[2075,2078,2081],{"name":2076,"color":2077},"3.x","29bc7f",{"name":2079,"color":2080},"❗ p4-important","D93F0B",{"name":2082,"color":2083},"performance","E84B77",25029,"Incremental call of watch if Page use defineNuxtComponent Setup - Maybe a Memory Leak?","2024-05-03T10:27:39Z","https://github.com/nuxt/nuxt/issues/25029",0.7285876,{"description":2090,"labels":2091,"number":2092,"owner":1988,"repository":2093,"state":2028,"title":2094,"updated_at":2095,"url":2096,"score":2097},"@harlan-zw hi!\r\n\r\nI may have missed it somewhere, although I've gone through the documentation completely.\r\nCan you please tell me if it is possible to add two or more GTM containers?\r\nIf so, how do I use them?\r\n\r\nIn brief - I need to use different gtm-id on different url's. And the GTM script should be loaded immediately, by default",[],154,"scripts","Two or more GTM containers","2024-08-07T02:22:06Z","https://github.com/nuxt/scripts/issues/154",0.72889364,{"description":2099,"labels":2100,"number":2105,"owner":1988,"repository":2038,"state":2028,"title":2106,"updated_at":2107,"url":2108,"score":2109},"### Description\n\nHow can I customize component styles in v3?\nI learned from `https://ui3.nuxt.dev/getting-started/theme` that styles can be customized in `app.config.ts` For example:\n```ts\nexport default defineAppConfig({\n uiPro: {\n header: {\n slots: {\n root: 'bg-[var(--ui-bg)]/75 backdrop-blur border-b border-[var(--ui-border)] sticky top-0 z-50',\n container: 'flex items-center justify-between gap-3 h-[var(--ui-header-height)]',\n left: 'lg:flex-1 flex items-center gap-1.5',\n center: 'hidden lg:flex',\n right: 'flex items-center justify-end lg:flex-1 gap-1.5',\n title: 'shrink-0 font-bold text-xl text-[var(--ui-text-highlighted)] flex items-end gap-1.5',\n toggle: 'lg:hidden',\n content: 'lg:hidden',\n overlay: 'lg:hidden',\n header: '',\n body: 'p-4 sm:p-6 overflow-y-auto'\n },\n variants: {\n toggleSide: {\n left: {\n toggle: '-ms-1.5'\n },\n right: {\n toggle: '-me-1.5'\n }\n }\n }\n }\n }\n})\n```\nHowever, after testing this approach, it doesn’t seem to work. So I’d like to ask specifically how to modify the style of an entire component in v3.\nFor instance, I want to customize the style of `UHeader`\nPlease forgive me if this is a silly question. English is not my native language, so I might have missed some details mentioned elsewhere.",[2101,2104],{"name":2102,"color":2103},"question","d876e3",{"name":2048,"color":2049},3070,"How can I customize component styles in v3?","2025-01-13T00:58:26Z","https://github.com/nuxt/ui/issues/3070",0.7295092,["Reactive",2111],{},["Set"],["ShallowReactive",2114],{"TRc1wZytZ_XrK4EfJfei_Sz-An4H4Yy6syhVxH_PVJc":-1,"Q3hyScp4vkvqJHKbcr1BBnj5WEksMmk_hJQUc0EAKg4":-1},"/nuxt/nuxt.com/1179"]