目录结构
- icons
- svg
- 404.svg
- *.svg
- index.js
1.index.js 引入svg文件
import Vue from 'vue'
import SvgIcon from '@/components/SvgIcon'// svg组件
// register globally
Vue.component('svg-icon', SvgIcon)
const req = require.context('./svg', false, /\.svg$/)
const requireAll = requireContext => requireContext.keys().map(requireContext)
requireAll(req)
1.‘@/components/SvgIcon'绝对路径引入插件
2.Vue.component('svg-icon', SvgIcon) 全局注册组件，可以全局使用
3.require.context('./svg', false, /.svg$/)
引入一个目录，正则表达式检索目录内的指定文件，上面表示检索svg目录下的所有.svg文件
官方链接
具体使用参考：
vue中引入.svg图标，使用iconfont图标库
https://www.jianshu.com/p/7e65608ddc0a
网友评论