//插件引入 import { createSvgIconsPlugin } from 'vite-plugin-svg-icons' import path from 'path' plugins: [ vue(), Components({ // UI库 resolvers: [ArcoResolver()], }), createSvgIconsPlugin({ // 指定需要缓存的图标文件夹 iconDirs: [path.resolve(process.cwd(), "src/assets/icons")]...
// svg图标import'virtual:svg-icons-register'importSvgIconfrom '@/components/SvgIcon' app.component('svg-icon',SvgIcon); 1. 2. 3. 4. 5. 通过vite-plugin-svg-icons 使用SVG图片 下面这个转自:https://blog.csdn.net/weixin_53731501/article/details/125478380 一、安装 vite-plugin-svg-icons npm ...
vite-plugin-svg-icons是一个Vite插件,它的主要功能是将SVG图标转换为Vue组件,并自动导入。它使用了一种称为"SVG sprite"的技术来实现这一功能。 SVG sprite是一种将多个SVG图标合并到一个单独的SVG文件中的技术。通过将多个图标合并成一个文件,可以减少请求的次数,提高加载速度,并且可以通过CSS对这些图标进行样式...
方便在项目中使用 .svg 文件,为什么要使用svg而不使用icons,详见:https://juejin.cn/post/7243680440690638904 登录阿里巴巴矢量图标库使用 -https://www.iconfont.cn/,只需把下载好的 svg 文件统一放到指定assets/svg目录下 安装: npm i vite-plugin-svg-icons -D vite.config.js配置 import { defineConfig,load...