\n\u003C/template>\n\n\u003Cscript setup>\nconst props = defineProps({\n name: {\n type: String,\n required: true,\n },\n strokeColor: {\n type: String,\n default: \"\",\n },\n fillColor: {\n type: String,\n default: \"\",\n },\n});\n\nconst getCustomized = (content) => {\n if (props.strokeColor) {\n content = content.replaceAll(\n /stroke=\"[^\"]*\"/g,\n `stroke=\"${props.strokeColor}\"`\n );\n }\n if (props.fillColor) {\n content = content.replaceAll(\n /fill=\"[^\"]*\"/g,\n `fill=\"${props.fillColor}\"`\n );\n }\n return content;\n};\n\u003C/script>\n\n```\n\nand here's how I use it\n``` vue\n\u003CKBIcon name=\"kb:burger\" strokeColor=\"red\" />\n\u003CKBIcon name=\"kb:burger\" strokeColor=\"blue\" />\n```\n\nEach KBIcon instance should render the icon with its respective strokeColor properties:\nThe first icon should have a red stroke.\nThe second icon should have a blue stroke.\n\nhowever, the actual behavior is both icons render with the same red strokeColor, indicating that the customize function result is being cached and reused. Any solution for this? I just need to set different colors for the same icon. I tried set style color but it also have the same cache result.\n\nhere's my svg I use (/assets/icons/burger.svg):\n``` javascript\n\u003Csvg width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n\u003Cpath d=\"M5 6.78137H19\" stroke=\"#9EA2AE\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\n\u003Cpath d=\"M5 11.6251H19\" stroke=\"#9EA2AE\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\n\u003Cpath d=\"M5 16.4687H19\" stroke=\"#9EA2AE\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\n\u003C/svg>\n```",[],"icon","local nuxt icon caching issue","2025-01-06T07:08:29Z","https://github.com/nuxt/icon/issues/332",{"labels":3080,"number":3083,"owner":3024,"repository":3024,"state":3025,"title":3084,"updated_at":3085,"url":3086,"score":3087},[3081,3082],{"name":3040,"color":3041},{"name":3021,"color":3022},13296,"Strange error message when use with tailwindcss (Importing directly from a nuxt.config file is not allowed)","2023-01-19T16:51:09Z","https://github.com/nuxt/nuxt/issues/13296",0.67415464,{"labels":3089,"number":3095,"owner":3024,"repository":3024,"state":3025,"title":3096,"updated_at":3097,"url":3098,"score":3099},[3090,3093,3094],{"name":3091,"color":3092},"good first issue","fbca04",{"name":3021,"color":3022},{"name":3053,"color":3054},7062,"tailwindcss-purgecss example is not more up to date","2023-01-22T15:34:48Z","https://github.com/nuxt/nuxt/issues/7062",0.6760218,{"description":3101,"labels":3102,"number":3105,"owner":3024,"repository":3024,"state":3025,"title":3106,"updated_at":3107,"url":3108,"score":3109},"### Describe the feature\r\n\r\nI wanted to add tailwind module so I ran `nuxi module add tailwind` and it added tailwind package instead of @nuxtjs/tailwindcss but we all know that I actually wanted to add the Tailwind Nuxt module. It would be very convenient if Nuxt was a bit smarter about this and understand what I actually meant.\r\n\r\nAs you can see what Nuxt actually added is completely wrong. Perhaps we could add some aliases to modules so nuxi could install the correct one? That would be very convenient. I have seen other projects do this and it is amazing DX.\r\n\r\nFor example, Symfony projects does this: https://github.com/symfony/recipes#aliases-option\r\n\r\nIt added `tailwind` instead of `@nuxtjs/tailwindcss`\r\n\r\n```diff\r\n \"devDependencies\": {\r\n \"@vueuse/nuxt\": \"^10.9.0\",\r\n+ \"tailwind\": \"^4.0.0\"\r\n }\r\n```\r\n\r\nand\r\n\r\n```diff\r\nexport default defineNuxtConfig({\r\n+ modules: [\"tailwind\"]\r\n})\r\n```\r\n\r\n### Additional information\r\n\r\n- [ ] Would you be willing to help implement this feature?\r\n- [ ] Could this feature be implemented as a module?\r\n\r\n### Final checks\r\n\r\n- [X] Read the [contribution guide](https://nuxt.com/docs/community/contribution).\r\n- [X] Check existing [discussions](https://github.com/nuxt/nuxt/discussions) and [issues](https://github.com/nuxt/nuxt/issues).",[3103,3104],{"name":3040,"color":3041},{"name":3021,"color":3022},26277,"Add module aliases so that running nuxi module add tailwind would actually install @nuxtjs/tailwindcss","2024-03-15T20:10:20Z","https://github.com/nuxt/nuxt/issues/26277",0.676351,{"description":3111,"labels":3112,"number":3119,"owner":3024,"repository":3120,"state":3025,"title":3121,"updated_at":3122,"url":3123,"score":3124},"### Environment\n\n```\r\n------------------------------\r\n- Operating System: Darwin\r\n- Node Version: v20.12.1\r\n- Nuxt Version: 3.11.2\r\n- CLI Version: 3.11.1\r\n- Nitro Version: 2.9.6\r\n- Package Manager: npm@10.5.0\r\n- Builder: -\r\n- User Config: ssr, devtools, modules, eslint, tailwindcss, ui, image, pwa, runtimeConfig, $production\r\n- Runtime Modules: @nuxt/eslint@0.3.10, @nuxt/image@1.6.0, @nuxt/ui@2.15.2, @vueuse/nuxt@10.9.0, @vite-pwa/nuxt@0.7.0\r\n- Build Modules: -\r\n------------------------------\r\n```\n\n### Version\n\n2.15.2\n\n### Reproduction\n\n[Error happening in nuxt/ui](https://stackblitz.com/edit/github-jq7nbz?file=nuxt.config.ts,tailwind.config.ts)\r\n[Error not happening with nuxtjs/tailwindcss module only](https://stackblitz.com/edit/github-swxuvb?file=tailwind.config.ts)\n\n### Description\n\nAdding a tailwind plugin that utilizes arbitrary values does not work via tailwind.config file.\r\nIt outputs a warning in the console\r\n```\r\nThe class mask-point-via-[3rem_calc(100%-3rem)] is ambiguous and matches multiple utilities.\r\n\r\nIf this is content and not a class, replace it with mask-point-via-[3rem_calc(100%-3rem)] to silence this warning.\r\n```\r\n\r\nIf I provide the same plugin in the nuxt.config, it is working fine there.\r\n\r\n\r\nI already tested if this is a problem with the nuxtjs/tailwindcss module, but providing the plugin in the tailwind.config file work just fine there. (c.f. second reproduction link)\r\n\r\nCan this be an issue with how nuxt/ui is consuming the tailwind config?\n\n### Additional context\n\n_No response_\n\n### Logs\n\n_No response_",[3113,3114,3117],{"name":3043,"color":3044},{"name":3115,"color":3116},"closed-by-bot","ededed",{"name":3118,"color":3116},"stale",1739,"ui","tailwind plugin in tailwind config file not working","2025-06-19T02:12:35Z","https://github.com/nuxt/ui/issues/1739",0.6767154,["Reactive",3126],{},["Set"],["ShallowReactive",3129],{"$fTRc1wZytZ_XrK4EfJfei_Sz-An4H4Yy6syhVxH_PVJc":-1,"$fCAn0hplsWZyhOYe-AkZ7lVjUn56eiw3uUBJ8mHL0r4o":-1},"/nuxt/ui/4327"]