Nuxt3下推荐一款svg图标组件——nuxt-icon

Nuxt3下推荐一款svg图标组件——nuxt-icon，组件为Nuxt官方Modules中推荐。可以很好的解决SVG图标的复用和按需加载问题，用起来方便，不用一次加载全部SVG图标，也不用将svg内容复制到h5代码中，方便管理且节省流量。 **安装组件** ``` npm i nuxt-icons --save ``` **配置组件** ``` nuxt.config.ts文件中加入 modules:['nuxt-icons'] ``` **图标引入** 在项目下建立文件夹 /assets/icons，将所有需要使用的svg图标放入该文件夹中则会自动按需引入，推荐可以在https://icones.js.org/和https://www.iconfont.cn/两个网站中在线选取想要的svg图标，直接下载保存到文件夹中。 **图标使用** ``` `<nuxt-icon name="svg图标名称不需要.svg结尾"/>`//当然也是支持class和style样式约束的。 ``` 注：如果有使用tailwindcss，会默认样式为svg{display:block}，导致svg图标为block而单占一行，可在tailwindcss.config.js或app.vue或统一引入样式文件中更改svg{display:inline}。