如何使用 customize-cra(2.x) 配置 Create-react-app less 模块?
How to configure Create-react-app less module with customize-cra(2.x)?
我使用 create-react-app(typescripts) 构建了一个项目,并按照 the website I was following 告诉我的那样使用 customize-cra 添加了 antd@3.26.13。
我想用module.css,我想用module.less,比如css,但是遇到了一些错误信息:
./src/layout/basic.module.less (./node_modules/css-loader/dist/cjs.js??ref--6-oneOf-8-1!./node_modules/postcss-loader/src??postcss!./node_modules/less-loader/dist/cjs.js??ref--6-oneOf-8-3!./src/layout/basic.module.less)
ValidationError: Invalid options object. CSS Loader has been initialized using an options object that does not match the API schema.
- options has an unknown property 'localIdentName'. These properties are valid:
object { url?, import?, modules?, sourceMap?, importLoaders?, localsConvention?, onlyLocals?, esModule? }
我的代码如下:
const {
override,
addWebpackAlias,
fixBabelImports,
addLessLoader,
addDecoratorsLegacy
} = require('customize-cra');
module.exports = override(
addWebpackAlias({
"@":require('path').resolve(__dirname,"src")
}),
fixBabelImports('import',{
libraryName:'antd',
libraryDirectory:'es',
style:true
}),
addLessLoader({
javascriptEnabled:true,
modifyVars:{'@primary-color':'#1DA57A'},
}),
addDecoratorsLegacy()
);
customize-cra
的当前版本与 create-react-app
的最新版本不兼容,准确地说是与 css-loader
不兼容。尝试安装 customize-cra@next
以获得 alpha 版本。他们在那里解决了这个问题。
我使用 create-react-app(typescripts) 构建了一个项目,并按照 the website I was following 告诉我的那样使用 customize-cra 添加了 antd@3.26.13。
我想用module.css,我想用module.less,比如css,但是遇到了一些错误信息:
./src/layout/basic.module.less (./node_modules/css-loader/dist/cjs.js??ref--6-oneOf-8-1!./node_modules/postcss-loader/src??postcss!./node_modules/less-loader/dist/cjs.js??ref--6-oneOf-8-3!./src/layout/basic.module.less)
ValidationError: Invalid options object. CSS Loader has been initialized using an options object that does not match the API schema.
- options has an unknown property 'localIdentName'. These properties are valid:
object { url?, import?, modules?, sourceMap?, importLoaders?, localsConvention?, onlyLocals?, esModule? }
我的代码如下:
const {
override,
addWebpackAlias,
fixBabelImports,
addLessLoader,
addDecoratorsLegacy
} = require('customize-cra');
module.exports = override(
addWebpackAlias({
"@":require('path').resolve(__dirname,"src")
}),
fixBabelImports('import',{
libraryName:'antd',
libraryDirectory:'es',
style:true
}),
addLessLoader({
javascriptEnabled:true,
modifyVars:{'@primary-color':'#1DA57A'},
}),
addDecoratorsLegacy()
);
customize-cra
的当前版本与 create-react-app
的最新版本不兼容,准确地说是与 css-loader
不兼容。尝试安装 customize-cra@next
以获得 alpha 版本。他们在那里解决了这个问题。