🐛[BUG]: ⚠️打包体积 / Tree Shaking 有问题 (有点离谱)

xsjcTony commented 5 months ago

🐛 bug 描述

前置条件:

[x] 我只使用了 @ant-design/pro-components 中的 LoginForm, ProFormText, ProFormCheckbox, 没用使用其他任何 pro 组件
[x] Vite 的 SPA 项目, 没有做过额外打包配置
[x] 使用 rollup-plugin-visualizer 来进行打包结果分析

📷 复现步骤

使用 LoginForm, 然后打包, 然后查看结果
切换为普通 Form, 然后打包, 然后查看结果
❌ 使用 ProForm之后打包结果很离谱, 里面绝大多数都是从来没有用到过的也被一起打包了

使用普通Form, 只用到这些 (✅结果非常的OK)

import { Alert, Checkbox, Form, Input, theme, Typography } from 'antd';

使用 LoginForm, 只用到如下这些 (❌结果很离谱, 完全失控)

import { LoginForm, ProForm, ProFormCheckbox, ProFormText } from '@ant-design/pro-components';
import { Alert, theme, Typography } from 'antd';

🏞 期望结果

应该只打包用到的部分.

💻 复现代码

上述很明确了, 贴代码不太方便, 应该也不需要

© 版本信息

ProComponents 版本: latest
umi 版本: N/A
浏览器环境: Chrome 120
开发环境: Windows 11

🚑 其他信息

我不觉得是需要手动分包的问题

我只在一个模块 (组件) 里使用了 ProForm, 结果就已经这么离谱了
像图中这些 select / cascader / picker / slider 都是不可能有用到的, 但是被打包进去了, Tree Shaking有问题
Tree Shaking正常的话, 打包结果应该和使用 antd 的 Form 差不多才对
综上, 我觉得是 pro-components 在这方面有问题

chenshuai2144 commented 5 months ago

有兴趣来个 pr 吗？为了支持 valueType 这些都要默认设置进去

github-actions[bot] commented 5 months ago

Hello @xsjcTony. We totally like your proposal/feedback, welcome to send us a Pull Request for it. Please provide changelog/TypeScript/documentation/test cases if needed and make sure CI passed, we will review it soon. We appreciate your effort in advance and looking forward to your contribution!

你好 @xsjcTony，我们完全同意你的提议/反馈，欢迎直接在此仓库创建一个 Pull Request 来解决这个问题。请务必提供改动所需相应的 changelog、TypeScript 定义、测试用例、文档等，并确保 CI 通过，我们会尽快进行 Review，提前感谢和期待您的贡献。

giphy

xsjcTony commented 5 months ago

对哦. 这么一看瞬间合理了. 这么看的话不是很复杂的场景还是不要用ProForm比较好哪怕只是LoginForm. PR的话🤣心有余而力不足只能说. 没时间也暂时没思路😥 感谢解答🙏

ant-design / pro-components