关于如何在Vue中使用Sass

1. 在 Vue 中使用 Sass

下面示例的环境是用vue-cli搭建，因此目录结构会与其他方式搭建的项目目录结构有所区别。
使用 npm 进行包管理。

1. 安装相关依赖
   Vue 的 webpack 项目中需要安装上 node-sass、sass-loader、style-loader，所以需要先通过命令行安装。

   # 一次性安装全部
   npm i node-sass sass-loader style-loader -D
   

2. 在 webpack 中配置 loader
   在项目中的/build/webpack.base.config.js文件的module.export内的module.rules中加入解析 scss 文件的 loader：

   module.exports = {
          
     // other configurations...
     module: {
          
       rules: [
         // ...
         {
          
           test: /\.scss$/,
           loaders: ['style','css','sass']
         }
       ]
     }
   }
   

3. 在 .vue文件中指定