Antd3升4，踩坑指南~

全量升级

升级前一定要看官方文档啊，手动改了一部分文件后才发现，还有升级工具😶--->codemod cli@ant-design/codemod-v4

# 通过 npx 直接运行 
npx -p @ant-design/codemod-v4 antd4-codemod src 

# 或者全局安装 
# 使用 npm 
npm i -g @ant-design/codemod-v4 
# 或者使用 yarn 
yarn global add @ant-design/codemod-v4

# 运行 
antd4-codemod src

全量升级问题总结

1. table column中的filters value如果为数组，在onchange回调中获取到的filters格式会变为字符串，需要特殊处理下
2. pagination showSizeChanger由原来的默认不翻页改为总条数大于50自动展示
3. icon引入方式建议为第二种，打包体积可以小1.3M左右

Antd3与4共存

可能有时候会有这样的场景，同一个项目中旧业务涉及内容复杂，维护艰难不敢轻易升级。但有新功能想用Antd4，此时可以尝试第二种升级方案-多版本共存，具体如下：

1. 可通过npm安装antd的指定版本，并为改版本指定别名，与之前antd3共存在package.json中

# 安装
npm install antd4@npm:antd@4.16.7

"antd": "3.26.19",
"antd4": "npm:<antd@4.16.7>",

2. 页面引入方式

import { DatePicker, Space } from 'antd4';