stylus引用公共变量

stylus引用公共变量
最近开发项目中碰到一个问题，如何在全局中引入一次全局的stylus变量，而不用每个用到的文件都去引入一次，如果做不到全局引入，就会显得非常麻烦。
首先，我做的是直接在main.js中直接import进去，但是发现只有写死的样式才会生效，像我在这个variables文件中定义的一些变量，在页面里根本不生效。
然后。。嗯，百度是个好东西，找到个可行的方法,具体步骤如下：

在build/utils.js的generateLoaders方法下做如下修改

  var stylusOptions = { 
    //  variables.styl是我单独定义的stylus公共变量的文件，注意地址要引入正确
    import: [  path.join(__dirname, "../src/assets/styles/variables.styl"), ]
  }
  return {
    css: generateLoaders(),
    postcss: generateLoaders(),
    less: generateLoaders('less'),
    sass: generateLoaders('sass', { indentedSyntax: true }),
    scss: generateLoaders('sass'),
    // stylus: generateLoaders('stylus'),  
    // styl: generateLoaders('stylus')
    stylus: generateLoaders('stylus',stylusOptions),
    styl: generateLoaders('stylus',stylusOptions)
  }

注意：记住这stylus与styl都必须要加入stylusOptions，否则不会生效。

这样就可以定义一个styl格式的文件来保存css变量啦，并且不需要每个页面都import引入了。美滋滋