ruriko v0.0.4-2

依赖

yarn add svg-sprite-loader -S

Libraries backing ruriko

• waves
• Leaderline
• TweenMax

main.ts

import { createApp } from "vue";
import App from "./App.vue";
import Ruriko from "ruriko";

const app = createApp(App);
app.use(Ruriko, { svg: require.context("ruriko", true, /\.svg$/) })

vue.config.js

const path = require("path");
module.exports = {
  chainWebpack: (config) => {
      const dir = path.resolve(__dirname, 'node_modules/ruriko')  //确定icon所在的目录
      config.module  //config是vue把webpack的API封装暴露给我们的一个对象，让我们使用
        .rule('svg-sprite')  //添加一个规则
        .test(/\.svg$/)  //文件匹配正则就用上面的规则
        .include.add(dir).end() //规则只包含icons目录
        .use('svg-sprite-loader'/*使用svg-sprite-loader*/).loader('svg-sprite-loader').options({ extract: false,symbolId: 'icon-[name]' }/*不要解析出文件*/).end()
      config.plugin('svg-sprite').use(require('svg-sprite-loader/plugin')), [{ pluginSprite: true }]//配置插件
      config.module.rule('svg').exclude.add(dir)//其他svg loader排除 icons目录
  }
};