vue-cli3.0 给每个.vue文件的css stylus设置全局变量

在vue项目中使用如sass、less、stylus时需要进行公共变量、方法的集中维护

vue-cli3.0构建的服务使用如下方法可直接在每个css中引入公共变量、方法
此处只说明了style 的引入，其他less sass引入在vue-cli3.0文档中有说明

stylus详见：https://github.com/webpack-contrib/stylus-loader#stylusOptions

其他: https://cli.vuejs.org/zh/guide/css.html#css-modules

// vue.config.js 文件

module.exports = {
  css: {
    loaderOptions: {
      // 给 stylus-loader 传递选项
      stylus: {
       // @/ 是 src/ 的别名
        // 所以这里假设你有 `src/common/stylus/color.styl` 这个文件，需要在没有vue文件中import
        import: '~@/common/stylus/color.styl'
      }
    }
  }
}
// .vue文件的 会在loader后在 <style lang="stylus"> 头部插入import src/common/stylus/color.styl
// 缺少loader直接npm安装到开发环境就可以了