項(xiàng)目背景
- 腳手架vue-cli：4.x
- vue: 3.x
- less-loader: 7.x
安裝less less-loader:
npm install less less-loader --save-dev
配置
vue.config.js：
module.exports = {
css: {
loaderOptions: {
less: {
javascriptEnabled: true,
globalVars: {
primary: '#fff'
}
}
}
}
...
}
啟動(dòng)報(bào)錯(cuò)如下：
Invalid options object. Less Loader has been initialized using an options object that does not match the API schema.- options has an unknown property 'globalVars'. These properties are valid: object { lessOptions?, additionalData?, sourceMap?, webpackImporter? }
image.png
根據(jù)報(bào)錯(cuò)毅戈，我們可以看到
javascriptEnabled和globalVars是不合理的options驶沼，期望得到的屬性是lessOptions等
解決方法
方法一
修改配置如下：
module.exports = {
css: {
loaderOptions: {
less: {
// 屬性值包裹在lessOptions內(nèi)
lessOptions: {
javascriptEnabled: true,
globalVars: {
primary: '#fff'
}
}
}
}
}
...
}
方法二：
less-loader版本降級(jí)至5.0.0版本
