1.安裝antd 後,執行 yarn add react-app-rewired customize-cra
2.在package.json文件中作出如下修改
/* package.json */
"scripts": {
- "start": "react-scripts start",
+ "start": "react-app-rewired start",
- "build": "react-scripts build",
+ "build": "react-app-rewired build",
- "test": "react-scripts test",
+ "test": "react-app-rewired test",
}
3.根目錄創建一個 config-overrides.js
用於修改默認配置。
module.exports = function override(config, env) {
// do stuff with the webpack config...
return config;
};
4.安裝babel-plugin-import ,執行 yarn add babel-plugin-import
將config-overrides.js
文件改爲
const { override, fixBabelImports } = require('customize-cra');
module.exports = override(
fixBabelImports('import', {
libraryName: 'antd',
libraryDirectory: 'es',
style: 'css',
}),
);
6.在項目中使用antd控件