导航


HTML

CSS

JavaScript

浏览器 & 网络

版本管理

框架

构建工具

TypeScript

性能优化

软实力

算法

UI、组件库

Node

业务技能

针对性攻坚

AI


推荐看 3x 版本的文档,更详细

在 create-react-app 中使用 - Ant Design

按需引入+自定主题

高级配置

自定义主题

1.安装依赖:yarn add react-app-rewired customize-cra babel-plugin-import less less-loader
2.修改package.json
		....
			"scripts": {
				"start": "react-app-rewired start",
				"build": "react-app-rewired build",
				"test": "react-app-rewired test",
				"eject": "react-scripts eject"
			},
		....
3.根目录下创建config-overrides.js
		//配置具体的修改规则
		const { override, fixBabelImports,addLessLoader} = require('customize-cra');
		module.exports = override(
			fixBabelImports('import', {
				libraryName: 'antd',
				libraryDirectory: 'es',
				style: true,
			}),
			addLessLoader({
				lessOptions:{
					javascriptEnabled: true,
					modifyVars: { '@primary-color': 'green' },
				}
			}),
		);
	4.备注:不用在组件里亲自引入样式了,即:import 'antd/dist/antd.css'应该删掉