- 安装
svg-sprite-loader
- cli3以上的版本 在vue.config.js 配置如下
module.exports = { lintOnSave: process.env.RELEASE_ENV !== 'production', publicPath: 'tenant', assetsDir: 'static', devServer: {}, css: {}, // 以下才是svg的配置 chainWebpack: config => { config.module .rule('svg') .exclude.add(resolve('src/assets/image/svg/icon')) .end() config.module .rule('icon') .test(/\.svg$/) .include.add(resolve('src/assets/image/svg/icon')) .end() .use('svg-sprite-loader') .loader('svg-sprite-loader') .options({ symbolId: 'icon-[name]' }) } }
- 封装组件 svg-icon
// 本文中的文件目录为:src/views/widget/svg-icon/Index.vue <template lang="pug"> svg
Vue 中svg的使用
最新推荐文章于 2022-06-18 13:34:27 发布
![](https://img-home.csdnimg.cn/images/20240711042549.png)