svg-icon-jdc
v1.0.3
Published
vue svg-loader 精灵图
Downloads
2
Readme
说明
一款快速调用 svg 中 use id的模版,适合精灵图开发
使用说明
js部分
import svgIcon from 'svg-icon-jdc';
svgIcon.install(Vue);
// 倒入需要规范的 svg 文件
const req = require.context('./../../asset/svgSprite', false, /\.svg$/)
const requireAll = requireContext => {
requireContext.keys().map(requireContext)
}
requireAll(req)
webpack部分 如果没有 file-loader 等文件路径工具只需要如下
{
test: /\.svg$/,
loader: 'svg-sprite-loader',
include:[path.resolve('src/asset/svgSprite')],
options:{
symbolId:'icon-[name]'
}
}
如果有 file/url 等文件路径路径工具 需要添加 对应的路径来忽略这个文件
exclude:[path.resolve('src/asset/svgSprite')]
下面是一个loader的配置例子
{
test: /\.(png|jpg|gif|webp|woff|eot|ttf|svg)$/,
use:{
loader:'url-loader',
options:{
name:'img/[name].[ext]',
limit:3000
}
},
exclude:[path.resolve('src/asset/svgSprite')]
}