Vue安装sass

1. cnpm install --save-dev node-sass （安装sass-loader的依赖）

2. cnpm install --save-dev sass-loader 或者

   cnpm install sass-loader@7.3.1 --save-dev
   (使用上面一行后面可能有版本过高的问题"TypeError: loaderContext.getResolve is not a function")

3. 在build里的webpack.base.conf.js中指定位置加上配置 (根据需求添加)

   (1) sass-loader 默认的处理不基于缩进的 scss 语法的配置

module.exports = {
  ...
  ...
  module: {
    rules: [
      ...
      {
        test: /\.scss$/,
        use: [
          'vue-style-loader',
          'css-loader',
          'sass-loader'
        ]
      }
    ]
  },
  ...
}

(2)基于缩进的 sass 语法的配置

module.exports = {
  ...
  ...
  module: {
    rules: [
      ...
		{
		  test: /\.sass$/,
		  use: [
		    'vue-style-loader',
		    'css-loader',
		    {
		      loader: 'sass-loader',
		      options: {
		        indentedSyntax: true,
		        // sass-loader version >= 8
		        sassOptions: {
		          indentedSyntax: true
		        }
		      }
		    }
		  ]
		}
    ]
  },
  ...
}

4. 在style中加入lang=“scss” 或者lang=“sass”

<style lang="scss" scoped>
//scss代码
</style>

<style lang="sass" scoped>
//sass代码
</style>