React-antd introduces + custom themes on demand
We need to customize the default configuration of create-react-app. Here we use react-app-rewired (a community solution for customizing-create-React-app).
Introduce react-app-rewired and modify the startup configuration in package.json. Thanks to the new [email protected] version, you’ll also need to install customize-cra.
Install dependencies: yarn add react-app-rewired customize-cra babel-plugin-import less less-loader 2. Modify the package. The json... "scripts": { "start": "react-app-rewired start", "build": "react-app-rewired build", "test": "react-app-rewired test", "eject": "react-scripts eject" }, .... 3. Root directory to create config - overrides. Js / / concrete rules of the modified configuration const {override, fixBabelImports addLessLoader} = the require (' customize - cra); module.exports = override( fixBabelImports('import', { libraryName: 'antd', libraryDirectory: 'es', style: true, }), addLessLoader({ lessOptions:{ javascriptEnabled: true, modifyVars: { '@primary-color': 'green' }, } }), ); 4. Note: There is no need to introduce styles in the component itself, i.e. import 'antd/dist/antd.css' should be deletedCopy the code