vue项目引入less

1、安装less

npm install less-loader@4.1.0 --save

安装完成后打开 build目录，修改 webpack.base.conf.js 中的相关配置：
在 module.exports 中找到 module 中的 rules 数组

module.exports = {
  ...
  ...
  module: {
    rules: [
    {...},
    {...},
    {
      test: /\.less$/,
      loader: 'style-loader!css-loader!less-loader'
    }
  ]
}

2、使用less

在.vue文件的 style 标签中添加 lang="less"后，即可采用less的语法编写CSS代码
附：引入变量(varibles)和混合(mixins)的写法如下：
在 src/assets/目录下新建 styles 目录，并在此目录下编写 varibles.less 和 mixins.less
编写CSS代码时通过 import 引入：

<style lang="less" scoped>
@import '../assets/styles/varibles.less';
@import '../assets/styles/mixins.less';
/* 样式代码 */
</style>