vue cli3.0及以上，全局less文件引入

背景：在开发中我们常常需要引入全局的样式文件，来定义一些通用的样式和变量，比如字体，颜色等；而不想使用每次使用@import。

步骤：

1、vue cli3.0以上需要新建vue.config.js文件

2、安装dev依赖"style-resources-loader"

3、在"/src/assets/css/"路径下添加自定义less文件，在vue.config.js粘贴以下内容

const path = require("path");

module.exports = {
  chainWebpack: (config) => {
    const types = ["vue-modules", "vue", "normal-modules", "normal"];
    types.forEach((type) =>
      addStyleResource(config.module.rule("less").oneOf(type))
    );
  },
};

function addStyleResource(rule) {
  rule
    .use("style-resource")
    .loader("style-resources-loader")
    .options({
      patterns: [path.resolve(__dirname, "./src/assets/css/common.less")],
    });
}