一、先创建一个vue项目：

在命令行执行 npm install vue-cli -g ，全局安装 vue-cli 脚手架，如果已全局安装过，则不必再次安装。 安装之后，在项目文件夹下执行命令 vue init webpack myApp ,创建一个vue项目（myApp 为项目名称）。

二、安装scss依赖包：

npm install sass-loader --save-dev
npm install node-sass --save-dev

三、在build文件夹下修改 webpack.base.conf.js 文件：

在 module 下的 rules 里添加配置，如下：

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

四、应用：

在vue文件中应用scss时，需要在style样式标签上添加lang="scss"，即<style lang="scss">。

<style lang="scss" scoped>
  @import "../assets/style/common.scss";
  @import "../assets/style/mixin.scss";
  $margin: 10px 0;
  .loginContainer {
    @include wh(250px, auto);
    @include flex(column, center, center);
    .loginItem {
        margin: $margin;
     }
  }
</style>

注意：此处引用外部scss文件时，要加@，且需在末尾加分号。