最近在做自己的博客，初次使用vue2.0+webpack 2.0搭建的项目，本来配置了scss用的很顺利了，可是随着博客的开发发现越来越需要搞个全局变量文件配置，根据百度到的资料配置全局一直报错，折腾了快一天才终于解决，得记录下来以后方便查阅。
刚开始是一直报：scss expected 1 selector or at-rule,was "{}" 这个错误，翻来覆去检查都没有问题，于是怀疑是版本问题，还把sass-resources-loader卸载重新安装，依然没有用，最终按照npm官方的方式配置成功。
小白开始配置的时候要注意到版本的问题，不同版本配置不同。我使用的是2.0的版本，故做如下修改：
/* Webpack@2: webpack.base.conf.js */ module: { rules: [ // Apply loader { test: /\.scss$/, use: [ 'style-loader', 'css-loader', 'postcss-loader', 'sass-loader', { loader: 'sass-resources-loader', options: { // Provide path to the file with resources resources: './path/to/resources.scss', // Or array of paths resources: ['./path/to/vars.scss', './path/to/mixins.scss'] }, }, ], }, ], }, /* 在utils.js文件第42行后加上如下代码 */ if (loader === 'sass') { loaders.push({ loader: 'sass-resources-loader', options: { resources: 'path/to/your/file.scss', }, }); }然后重启生效。瞬间发现一切原来如此简单。
