` component has not been used.`\r\n\r\nthis is also in the same stackblitz. Layout works fine.\r\nExplain me please is this way to do layouts is worng and i have to use App.vue ?\n\n### Logs\n\n_No response_",[2889,2892],{"name":2890,"color":2891},"3.x","29bc7f",{"name":2893,"color":2894},"pending triage","E99695",25005,"Href use svg symbol","2024-01-02T14:01:38Z","https://github.com/nuxt/nuxt/issues/25005",0.68040293,{"description":2901,"labels":2902,"number":2905,"owner":2871,"repository":2871,"state":2872,"title":2906,"updated_at":2907,"url":2908,"score":2909},"### Version\n\n[v1.4.2](https://github.com/nuxt.js/releases/tag/v1.4.2)\n\n### Reproduction link\n\n[https://github.com/FistMeNaruto/vue-svg-loader-test](https://github.com/FistMeNaruto/vue-svg-loader-test)\n\n### Steps to reproduce\n\nDo everything described in https://vue-svg-loader.js.org/ documentation.\n\n### What is expected ?\n\nSVG of a circle on the homepage\n\n### What is actually happening?\n\nSVG gets converted to base64 even though svg files should not be processed by the url loader anymore.\n\n### Additional comments?\n\nIssue on vue-svg-loader repo: visualfanatic/vue-svg-loader#41\n\n\u003C!--cmty-->\u003C!--cmty_prevent_hook-->\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/c7599\">#c7599\u003C/a>)\u003C/em>\u003C/sub>\u003C/div>",[2903,2904],{"name":2893,"color":2894},{"name":2868,"color":2869},3763,"Vue-svg-loader not working with Nuxt","2023-01-22T15:30:05Z","https://github.com/nuxt/nuxt/issues/3763",0.68651015,{"labels":2911,"number":2914,"owner":2871,"repository":2871,"state":2872,"title":2915,"updated_at":2916,"url":2917,"score":2918},[2912,2913],{"name":2893,"color":2894},{"name":2868,"color":2869},7977,"nuxt-svg: Unexpected '.svg' rule in the webpack configuration","2023-01-22T15:36:07Z","https://github.com/nuxt/nuxt/issues/7977",0.68853927,{"description":2920,"labels":2921,"number":2923,"owner":2871,"repository":2871,"state":2872,"title":2924,"updated_at":2925,"url":2926,"score":2927},"I know this has been asked before but no matter what I try I can't seem to make it work. \r\nI want to use a component that will render my svg icons inline.\r\n\r\nThis is my nuxt.config.js\r\n```\r\nbuild: {\r\n /*\r\n ** Run ESLINT on save\r\n */\r\n extend (config, ctx) {\r\n if (ctx.isClient) {\r\n config.module.rules.push({\r\n enforce: 'pre',\r\n test: /\\.(js|vue)$/,\r\n loader: 'eslint-loader',\r\n exclude: /(node_modules)/\r\n },\r\n {\r\n test: /\\.svg$/,\r\n include: /assets\\/svg/,\r\n use: [\r\n {\r\n loader: 'svg-inline-loader'\r\n }\r\n ]\r\n },\r\n {\r\n test: /\\.(png|jpe?g|gif)$/,\r\n loader: 'url-loader',\r\n exclude: /assets\\/svg/,\r\n query: {\r\n limit: 1000, // 1KO\r\n name: 'img/[name].[hash:7].[ext]'\r\n }\r\n })\r\n }\r\n },\r\n }\r\n```\r\n\r\nand this is my component: \r\n\r\n```\r\n\u003Ctemplate>\r\n \u003Cdiv>\r\n \u003Cspan :class=\"'icon-' + name\" class=\"icon\" v-html=\"url\">\u003C/span>\r\n \u003C/div>\r\n\u003C/template>\r\n\r\n\u003Cscript>\r\n export default {\r\n props: ['name'],\r\n computed: {\r\n url () {\r\n return require(`~/assets/svg/${this.name}.svg`)\r\n }\r\n }\r\n }\r\n\u003C/script>\r\n```\r\nAnd this is what gets rendered:\r\n\u003Cimg width=\"452\" alt=\"screenshot 2017-08-07 21 15 42\" src=\"https://user-images.githubusercontent.com/5978397/29042046-a2b7b058-7bb5-11e7-9ba9-e0d33b5e7016.png\">\r\n\r\n\r\n\r\n\n\n\u003C!--cmty-->\u003C!--cmty_prevent_hook-->\n\u003Cdiv align=\"right\">\u003Csub>\u003Cem>This question is available on \u003Ca href=\"https://nuxtjs.cmty.io\">Nuxt.js\u003C/a> community (\u003Ca href=\"https://nuxtjs.cmty.io/nuxt/nuxt.js/issues/c1165\">#c1165\u003C/a>)\u003C/em>\u003C/sub>\u003C/div>",[2922],{"name":2868,"color":2869},1315,"Can't make svg-inline-loader work","2023-01-18T15:41:02Z","https://github.com/nuxt/nuxt/issues/1315",0.68893516,{"description":2929,"labels":2930,"number":2932,"owner":2871,"repository":2871,"state":2872,"title":2933,"updated_at":2934,"url":2935,"score":2936},"Hi!\r\n\r\nWill you be adding support for SVG files via something like https://github.com/visualfanatic/vue-svg-loader ?\r\n\r\nI tried installing it and adding the loader in `nuxt.config.js`:\r\n\r\n```\r\nbuild: {\r\n extend (config) {\r\n loaders: [{\r\n test: /\\.svg$/,\r\n loader: 'vue-svg',\r\n }]\r\n }\r\n }\r\n```\n\n\u003C!--cmty-->\u003C!--cmty_prevent_hook-->\n\u003Cdiv align=\"right\">\u003Csub>\u003Cem>This question is available on \u003Ca href=\"https://nuxtjs.cmty.io\">Nuxt.js\u003C/a> community (\u003Ca href=\"https://nuxtjs.cmty.io/nuxt/nuxt.js/issues/c134\">#c134\u003C/a>)\u003C/em>\u003C/sub>\u003C/div>",[2931],{"name":2868,"color":2869},156,"Handle SVG files","2023-01-18T15:38:31Z","https://github.com/nuxt/nuxt/issues/156",0.6937277,{"description":2938,"labels":2939,"number":2941,"owner":2871,"repository":2871,"state":2872,"title":2942,"updated_at":2943,"url":2944,"score":2945},"First of all great job guys!\r\nI accidentally had a script tag inside a `.vue` file which I didn't notice. With the vue webpack template, you get a warning/error from the `vue-template-compiler` I think that there shouldn't be a script tag inside the `.vue` file.\r\n\r\n**Steps to reproduce:**\r\n1. Initialize nuxt from official nuxt template and run it locally\r\n2. Create a page inside `pages` dir which contains a script tag\r\n```vue\r\n\u003Ctemplate>\r\n \u003Cdiv class=\"copyright\">\r\n ©\r\n \u003Cscript>\r\n document.write(new Date().getFullYear())\r\n \u003C/script>, Designed by xxx\r\n \u003C/div>\r\n\u003C/template>\r\n\r\n\u003Cscript>\r\n export default {\r\n name: 'about-us'\r\n }\r\n\u003C/script>\r\n\r\n\u003Cstyle>\r\n\r\n\u003C/style>\r\n```\r\n3. Modify some text in the page. \r\n\r\n**What is expected?**\r\nNuxt will warn/give an error that you shouldn't have a script tag inside a `.vue` file.\r\n\r\n**What is actually happening?**\r\nPage hot reloads with no error but outputs only the script tag result. In this case, the current year.\r\n\r\nI know this might sound dumb, but might be confusing for beginners who accidentally drop some scripts without knowing. After that, it might be hard to track what is happening.\n\n\u003C!--cmty-->\u003C!--cmty_prevent_hook-->\n\u003Cdiv align=\"right\">\u003Csub>\u003Cem>This question is available on \u003Ca href=\"https://nuxtjs.cmty.io\">Nuxt.js\u003C/a> community (\u003Ca href=\"https://nuxtjs.cmty.io/nuxt/nuxt.js/issues/c2065\">#c2065\u003C/a>)\u003C/em>\u003C/sub>\u003C/div>",[2940],{"name":2868,"color":2869},2373,"Having a script tag inside page does not warn/error","2023-01-18T15:55:11Z","https://github.com/nuxt/nuxt/issues/2373",0.69594425,{"labels":2947,"number":2956,"owner":2871,"repository":2871,"state":2872,"title":2957,"updated_at":2958,"url":2959,"score":2960},[2948,2949,2950,2953],{"name":2890,"color":2891},{"name":2893,"color":2894},{"name":2951,"color":2952},"vite","3574D1",{"name":2954,"color":2955},"windows","C681FD",15050,"Dynamic component loading using addComponentsDir hook fails if template html is referenced using src on Windows","2023-01-19T17:44:20Z","https://github.com/nuxt/nuxt/issues/15050",0.7005053,{"description":2962,"labels":2963,"number":2965,"owner":2871,"repository":2871,"state":2872,"title":2966,"updated_at":2967,"url":2968,"score":2969},"Hello!\r\n\r\nHave anyone implemented svg loader? I am looking for a solution to use .svg images as components.\r\nIf I import .svg as a normal vue component, an error occurs:\r\n\r\n```\r\n[Vue warn]: Invalid Component definition: data:image/svg+xml;base64\r\n```\r\n\r\nAny suggestions?\r\n\r\nThank you very much! \n\n\u003C!--cmty-->\u003C!--cmty_prevent_hook-->\n\u003Cdiv align=\"right\">\u003Csub>\u003Cem>This question is available on \u003Ca href=\"https://nuxtjs.cmty.io\">Nuxt.js\u003C/a> community (\u003Ca href=\"https://nuxtjs.cmty.io/nuxt/nuxt.js/issues/c2012\">#c2012\u003C/a>)\u003C/em>\u003C/sub>\u003C/div>",[2964],{"name":2868,"color":2869},2302,"svg inline loader","2023-01-18T15:43:53Z","https://github.com/nuxt/nuxt/issues/2302",0.70103616,["Reactive",2971],{},["Set"],["ShallowReactive",2974],{"$fTRc1wZytZ_XrK4EfJfei_Sz-An4H4Yy6syhVxH_PVJc":-1,"$fS0l5FgnDi7-n-WUdP51CEeD3Qa8pq3fb_A1ITa1qES0":-1},"/nuxt/nuxt/1460"]