Vue中less使用步骤以及常见错误
最近写VUE项目,本来时间就比较紧急,结果环境还一直有问题,用到了less,感觉在上面踩了坑。终于找到了一个好的解决方式。记录一下也给需要帮助的人。
VUE如何配置less
1.npm安装less
npm install less less-loader --save-dev
2.更改配置文件
build/webpack.base.conf.js
3.在mudule rules中添加
{
test: /.less$/,
loader: “style-loader!css-loader!less-loader”, },
4.在VUE组件中使用
【npm run dev】启动项目后,报错:
****
原因是由于less-loader安装的版本过高,在【package.json】中,可查看到安装的版本
****解决方法:卸载安装的高版本的less-loader,【npm uninstall less-loader】,安装指定低版本的less-loader【npm install [email protected] --save】