React12使用ant-design组件库和按需加载配置
-
安装ant-design : npm install antd --save
-
使用:
注:示例引入了全部的antd组件的样式(对前端性能是个隐患)
-
上述引入有弊端,引入也很麻烦,所以我们在项目中需要配置ant-design按需加载
* 更改脚手架启动的配置:
《1》安装 react-app-rewired和 customize-cra插件:
yarn add react-app-rewired customize-cra
《2》更改package.json配置:
《3》然后在项目根目录创建一个config-overrides.js文件用于修改默认配置,先不用写内容
《4》执行安装babel-plugin-import插件(安装命令:yarn add babel-plugin-import)
《5》修改config-overrides.js文件内容如下:
注:这里会帮我们引入antd和css样式
《6》到这里就成功了,不用再去引入样式,想要使用antd组件就这样引入:
-
注:更改这些配置需要重新启动项目
博主掘金技术社区地址——https://juejin.cn/user/1908407918660871/posts