最近在做項(xiàng)目的時(shí)候漆际，使用antd-mobile定制主題淆珊，卻報(bào)了./node_modules/antd-mobile/es/button/style/index.less (./node_modules/css-loader/dist/cjs.js??ref--6-oneOf-7-1!./node_modules/postcss-loader/src??postcss!./node_modules/resolve-url-loader??ref--6-oneOf-7-3!./node_modules/less-loader/dist/cjs.js??ref--6-oneOf-7-4!./node_modules/antd-mobile/es/button/style/index.less)
ValidationError: Invalid options object. Less Loader has been initialized using an options object that does not match the API schema.
-
options has an unknown property 'modifyVars'. These properties are valid:
object { lessOptions?, prependData?, appendData?, sourceMap?, implementation? }
image.png
config-overrides.js的文件如下：
const { override, fixBabelImports , addLessLoader} = require("customize-cra");
const theme = require('./antd-theme');
module.exports = override(
addLessLoader({
javascriptEnabled: true,
modifyVars: theme
}),
fixBabelImports("import", {
libraryName: "antd-mobile",
libraryDirectory: 'es',
style: true,
}),
);
剛開始的時(shí)候也查了好久，因?yàn)橐郧巴瑯拥呐渲貌]有這樣的錯(cuò)誤灿椅，后來才猛然發(fā)現(xiàn)原來是less-loader的版本的原因套蒂，現(xiàn)在用的是"less-loader": "^6.1.0", 之前用的好像是5.6版本的。在less-loader版本中配置的參數(shù)具體可查https://www.npmjs.com/package/less-loader#lessoptions
其實(shí)從最后的報(bào)錯(cuò)信息就能看出來茫蛹，options的屬性值有五種：
果真還得仔細(xì)看報(bào)錯(cuò)信息啊操刀，哈哈
修改如下：
const { override, fixBabelImports , addLessLoader} = require("customize-cra");
const theme = require('./antd-theme');
module.exports = override(
addLessLoader({
lessOptions: {
javascriptEnabled: true,
modifyVars: theme
}
}),
fixBabelImports("import", {
libraryName: "antd-mobile",
libraryDirectory: 'es',
style: true,
}),
);
問題得以解決
