前置步骤:添加依赖
yarn add svg-sprite-loader -D
[可选] yarn add svgo svgo-loader -D
依赖说明:
sprites 会被自动渲染和注入页面,您只需通过 <svg><use xlink:href="#id"></use></svg>
工作原理是: 利用svg的
symbol
元素,将每个icon包括在symbol
中,通过use
元素使用该symbol
.
用于精简 svg 代码
第一步:创建图标库文件夹
第二步:配置 vue.config.js
const { resolve } = requ