如何在 vue 2.0+ 中引入全局的stylus文件，且能正常

由于stylus在引用时，不能像一般的css文件直接在main.js中引用，就算引用了也会只能使用转换后的css，不能使用里面的函数，方法等，原因可能是：在这里引入会被直接编译成css，不能在别的模板中引用一些函数啥的；所以夏敏介绍怎么全局引用。

打开vue-cli脚手架项目里面的 build --- utils.js 文件，具体位置如下：

然后对这个文件进行下面的修改，来全局引入想要引入的全局使用的stylus文件：

exports.cssLoaders = function(options) {
    
        ...........  //原来的部分不用修改的，省略号代替
    
         var stylusOptions = {
        import: [
            path.join(__dirname, "../src/common/stylus/mixin.styl") // variables.styl全局变量文件
        ],
        paths: [
            path.join(__dirname, "../src/common/"),
            path.join(__dirname, "../")
        ]
    }     //上面都是新加的内容，我这里是要引入 ../src/common/stylus/mixin.styl  这个全局的styl文件，来使用
 

    // https://vue-loader.vuejs.org/en/configurations/extract-css.html
    return {
        css: generateLoaders(),
        postcss: generateLoaders(),
        less: generateLoaders('less'),
        sass: generateLoaders('sass', { indentedSyntax: true }),
        scss: generateLoaders('sass'),
        stylus: generateLoaders('stylus', stylusOptions),  //这个也是需要新加上的
        styl: generateLoaders('stylus', stylusOptions)     //这个也是需要新加上的
    }
    
        }    

这样就可以在所有的vue模块中去使用这个stylus文件里面的样式和函数，方法等