使用vue-cli创建的项目如是使用less

使用vue-cli创建的项目默认是不支持less语法的，如何让项目支持less呢？

使用以下命令安装less和less-loader

npm install less less-loader --save-dev

然后打开 build/webpack.base.conf.js 文件，在 module.exports = 的对象的 module.rules 后面添加less的配置：

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

上面两部完成之后，我们在<style lang="less">标签中添加lang=less，然后我们就可以愉快的使用less书写css样式了