Ant Design的按需引入+自定义主题颜色

Ant Design的按需引入+自定义主题颜色

一、安装依赖：

yarn add react-app-rewired customize-cra babel-plugin-import less less-loader

二、修改package.json

...."scripts": {"start": "react-app-rewired start","build": "react-app-rewired build","test": "react-app-rewired test","eject": "react-scripts eject"},
....

三、根目录下创建config-overrides.js

//配置具体的修改规则
const { override, fixBabelImports,addLessLoader} = require('customize-cra');
ports = override(fixBabelImports('import', {libraryName: 'antd',libraryDirectory: 'es',style: true,}),addLessLoader({lessOptions:{javascriptEnabled: true,modifyVars: { '@primary-color': 'green' },}}),
);

四、备注

不用在组件里亲自引入样式了，即：import 'antd/dist/antd.css’应该删掉