vue2中使用sass并配置全局的sass樣式變量的方法

 "sass-loader": "^6.0.7",
 "sass-resources-loader": "^1.3.3",

{
 test: /\.scss$/,
 loaders: ["style", "css", "sass"]
 }

 function resolveResouce(name) {
 return path.resolve(__dirname, '../src/common/sass/' + name);
 }
 function generateSassResourceLoader() {
 var loaders = [
 cssLoader,
 'postcss-loader',
 'sass-loader',
 {
 loader: 'sass-resources-loader',
 options: {
 //這是用到的sass文件，多個文件時用數(shù)組的形式傳入，這是帶有變量和mixin的scss文件
 resources: [resolveResouce('variable.scss'), resolveResouce('mixin.scss')] 注意這是我全局樣式的位置，個人不同，需做調(diào)整
 }
 }
 ];
 if (options.extract) {
 return ExtractTextPlugin.extract({
 use: loaders,
 fallback: 'vue-style-loader'
 })
 } else {
 return ['vue-style-loader'].concat(loaders)
 }
 }

 return {
 css: generateLoaders(),
 postcss: generateLoaders(),
 less: generateLoaders('less'),
 //sass: generateLoaders('sass', { indentedSyntax: true }),
 //scss: generateLoaders('sass'),
 sass: generateSassResourceLoader(),
 scss: generateLoaders('sass')
 .concat(
 {
 loader: 'sass-resources-loader',
 options: {
 resources: path.resolve(__dirname, '../src/common/sass/index.scss') //注意這是我全局樣式的位置，個人不同，需做調(diào)整
 }
 }
 ),
 stylus: generateLoaders('stylus'),
 styl: generateLoaders('stylus')
 }