Create-React-App 版本：v4.0.1
1. 未执行yarn eject的情形下
@craco/craco（Create React App Configuration Override - 配置扩展库）版本：v5.8.0
craco.config.js配置文件代码内容如下：
const CracoLess = require(‘craco-less‘); const CracoAntDesign = require(‘craco-antd‘); const path = require(‘path‘); module.exports = { plugins: [ // 针对Less的相关配置（如module样式） { plugin: CracoLess, options: { lessLoaderOptions: { lessOptions: { javascriptEnabled: true }, }, modifyLessRule: function() { return { test: /\.module\.less$/, exclude: /node_modules/, use: [ { loader: ‘style-loader‘ }, { loader: ‘css-loader‘, options: { modules: { localIdentName: ‘[local]_[hash:base64:6]‘, }, }, }, { loader: ‘less-loader‘ }, ], }; }, }, }, // `Ant Design`相关配置 { plugin: CracoAntDesign, options: { customizeThemeLessPath: path.join( __dirname, ‘src/antd.customize.less‘, ), }, }, ], };
2. CRA原始工程已被eject的情形下
CRA v4.0.1版本eject后直接运行可能会报错，提示“找不到@babel/plugin-syntax-jsx” ！
这里我们手动安装一下: yarn add -D @babel/plugin-syntax-jsx
因为工程中，我们还需要用到less和less-loader，所以先安装下：
yarn add -D less less-loader
webpack.config.js文件中（v4.0.1版本的第535行之后，sass相关配置之后）增添如下代码：
{ test: lessRegex, exclude: lessModuleRegex, use: getStyleLoaders( { importLoaders: 3, sourceMap: isEnvProduction ? shouldUseSourceMap : isEnvDevelopment, }, ‘less-loader‘ ), sideEffects: true, }, { test: lessModuleRegex, use: getStyleLoaders( { importLoaders: 3, sourceMap: isEnvProduction ? shouldUseSourceMap : isEnvDevelopment, modules: { getLocalIdent: getCSSModuleLocalIdent, }, }, ‘less-loader‘ ), }, // lessRegex 在上部自行定义： const lessRegex = /\.less$/; // lessModuleRegex 在上部自行定义： const lessModuleRegex = /\.module\.less$/;