vue-cli安裝使用less

vue-cli構建的項目默認是不支持less的，須要本身添加依賴
1.安裝less和less-loader ，在項目目錄下運行以下命令
npm install less less-loader --save-dev

2.安裝成功後，打開build/webpack.base.conf.js ，在 module.exports = 的對象的module.rules 後面添加一段：
module.exports = {

//  此處省略無數行，已有的的其餘的內容
module: {
    rules: [
      //  此處省略無數行，已有的的其餘的規則
      {
        test: /\.less$/,
        loader: "style-loader!css-loader!less-loader",
      }
    ]
  }
}

3.最後，在代碼中的style標籤中加上lang="less"屬性便可

<style lang="less" scoped>
  .index-wrap {
    display: flex;
    align-items: center;
    justify-content: center;
    span {
      font-size: 0.373rem;
    }
  }
</style>