Vue CLI 系列之（八）lang样式

lang样式

lang（language）：指定css使用的编写方式【css/less/sass/scss等】，不指定lang默认就是lang="css"

写法：<style lang="less">

css的预编译语言：less

• 脚手架处理不了less，处理less需要安装less-loader

• 使用npm i less-loader 安装后启动报错，该命令默认安装less-loader的最新版本，Vue脚手架使用的webpack版本是4.46.0，而less-loader 8.x 和 9.x 版本是为webpack 5服务的，不兼容webpack 4，所以需要降低less-loader的版本

• 卸载less-loader

npm uninstall --save less-loader

• 查看less-loader当前可用的版本都有哪些

npm view less-loader versions

• 指定版本安装less-loader，@7表示安装目前7版本中最新的版本

  npm i less-loader@7

• 安装后提示less-loader依赖于less

注：npm不能像yarn一样解决依赖包的问题，所以我们有时要看一下npm install后的warning，然后照着做，记得不要npm和yarn混用，会有一些其他错误发生

• 安装less 4.0.0

npm i less@4.0.0

• 安装后项目运行成功！