Be elegant, not dirty 💃

1. The installation depends on NPM I [email protected] 2. Configure the vue. Config. Js

Const path = require('path') function resolve (dir) {return path.join(__dirname, dir)} // Add a configuration {} {// omit other... chainWebpack (config) { // set svg-sprite-loader config.module .rule('svg') .exclude.add(resolve('src/icons')) .end() config.module .rule('icons') .test(/\.svg$/) .include.add(resolve('src/icons')) .end() .use('svg-sprite-loader') .loader('svg-sprite-loader') .options({ symbolId: 'icon-[name]' }) .end() } }Copy the code

3. Copy/create the file (1) SRC/ICONS

SRC/ICONS - / SVG # Save ICONS - /index.js # Register global componentsCopy the code

(2) components

componets/SvgIcon/index.vue
Copy the code

(3) validate. Js

utils/validate.js
Copy the code

4. Import in main.js

import '@/icons'
Copy the code

5. Use the format < svG-icon icon-class=” file name “/>. The file name in this case is the file name under SRC/ICONS/SVG