使用ant-design:
首先创建react项目：
create-react-app app
cd app
其次
AntDesign的高级配置：按需导入组件，自定义主题
1.下载依赖(利用yarn，或者npm都行)
yarn add react-router-dom //装路由插件
yarn add antd //装antd 插件 在 create-react-app 创建的工程中使用 antd 组件
yarn add react-app-rewired customize-cra //react-app-rewired （一个对 create-react-app 进行自定义配置的社区解决方案)
yarn add babel-plugin-import //babel-plugin-import 是一个用于按需加载组件代码和样式的 babel 插件
yarn add less less-loader //按照 配置主题 的要求，自定义主题需要用到 less 变量覆盖功能。
2.修改package.json
"scripts": {
"start": "react-app-rewired start",
"build": "react-app-rewired build",
"test": "react-app-rewired test",
}
- 表示要删除的
+ 表示要添加的
3，在项目根目录创建config-overrides.js
在项目根目录创建一个 config-overrides.js 用于修改默认配置。（js配置文件需要修改）
module.exports = function override(config, env) {
// do stuff with the webpack config...
return config;};
const { override, fixBabelImports, addLessLoader } = require(‘customize-cra‘);
module.exports = override(
fixBabelImports(‘import‘, {
libraryName: ‘antd‘,
libraryDirectory: ‘es‘,
style: true,
}),
addLessLoader({
javascriptEnabled: true,
modifyVars: { ‘@primary-color‘: ‘#1DA57A‘ },
}),
);