Umi 3.4，依赖打包、webpack 5 支持、按需编译、fastRefresh 匿名函数支持等

[sorrycc]

Hi，好久不见。

依赖打包

依赖打包指把 node 相关依赖进行打包锁定，现在越来越多的框架和工具都这么处理，因为好处很多，

• 安装时 0 peerDependencies Warning
• 安装尺寸从 114M 降到 76M，详见 packagephobia
• 依赖总量从 786 个减少到 225 个
• 安装速度提升 1 倍（可能不止，我内网环境从 23.45s 到 4.82s）
• 更安全和稳定，依赖全锁定，Babel 深夜发版再也影响不到 UMI

webpack 5 支持

webpack 5 的支持拖了好久，因为同时适配 webpack 4 和 5 需要处理各种 peerDependencies 比较麻烦，这次借“依赖打包”的机会可以比较平滑实现一个包的多个版本共存。

UMI 已同时支持 webpack 4 和 webpack 5 的开发，默认是 webpack 4，可通过配置 webapck5: {} 切换至 webpack 5，默认开启物理缓存，配置开启 lazyCompilation 等，详见配置文档。

export default {
  webpack5: {},
};

基于路由的按需编译

按需编译目前有两种思路，1 是基于文件，比如 Vite，2 是基于路由，比如 Next 和 Umi 1。umi 3 上了之后一直想把按需编译功能加回来，正好看到 webpack 5 的 lazy compilation 可以很好地满足需求，于是在支持 webpack 5 时就顺手加上了。

通过配置 webpack5: { lazyCompilation: {} } 可开启基于路由的按需编译，用于解项目文件数超 3000 个的巨型应用启动缓慢问题。手动试过 antd-pro 可提速一倍，但也是有代价的，后续访问路由时会做增量编译。

export default {
  webpack5: {
    lazyCompilation: {},
  },
};

fastRefresh 支持匿名函数

fastRefresh 在 [email protected] 就加上了，但不支持匿名函数的导出，此版本对此进行了完善。

export default () => <h1>Hello UMI!</h1>;

其他

• 升级 immer@8，修复安全问题
• https://umijs.org/ 增加招人广告
• 修复 generateFile 的 watcher 取消不生效
• 优化约定式路由热编译性能

问题反馈

• https://github.com/umijs/umi/issues

[hanwenbo]

已升级~赞一个

[afc163]

迫不及待了

[duan602728596]

有些插件和loader引入了webpack的模块（比如monaco-editor-webpack-plugin、worker-loader），
会有The 'compilation' argument must be an instance of Compilation错误。
解决方案是需要将插件从webpack引入改为从@umijs/deps引入，目前我的解决方案是@bbkkbkk/umi-webpack5-export，拿项目试了一下，能编译成功了。

[zhangchao828]

webpack 5 的 lazy compilation 在哪里有提到，在webpack官网没找到相关的信息

[sorrycc]

@duan602728596 已内置处理了额外插件的 webpack 依赖问题，提 issue 给复现，我排查下具体原因吧。

[sorrycc]

@zhangchao828 webpack github 上的 release notes 里找找。

[duan602728596]

@duan602728596 已内置处理了额外插件的 webpack 依赖问题，提 issue 给复现，我排查下具体原因吧。

https://github.com/duan602728596/umi-3.4-demo
worker-loader里面使用了webpack的插件，启动会导致问题

[zhangchao828]

@zhangchao828 webpack github 上的 release notes 里找找。

找到了，自己实验了一下，发现首次打开浏览器，一片空白，得手动刷新一次才行，之后就好了，hmr是正常的

[MengShaofei]

请问，umi@3啥时候可以支持私有区块的接入

[sorrycc]

@MengShaofei 区块使用效果不佳，功能已暂停，短期不会投入开发。

[xiaohuoni]

我们有一个项目加了自定义的 webpack 插件。以下是比对情况：
[email protected]

[email protected]

[leeword]

@zhangchao828 webpack github 上的 release notes 里找找。

找到了，自己实验了一下，发现首次打开浏览器，一片空白，得手动刷新一次才行，之后就好了，hmr是正常的

同遇到这个问题，有没有解决方案

[jayguojianhai]

这是来自QQ邮箱的假期自动回复邮件。   您好，我最近正在休假中，无法亲自回复您的邮件。我将在假期结束后，尽快给您回复。

[zhangchao828]

@zhangchao828 webpack github 上的 release notes 里找找。

找到了，自己实验了一下，发现首次打开浏览器，一片空白，得手动刷新一次才行，之后就好了，hmr是正常的

同遇到这个问题，有没有解决方案

现在不知道怎么样了，当时记得这个配置有个entries选项设置为false就好了，另外devServer估计也要升级到新的