关于layout打包问题

[DroganC]

我在routes里面声明了一个布局，layout布局。
但是构建后layout也是异步加载的导致会出现一个loading
我不想出现这个loading，需要怎么解决呢？

感谢各位大佬 请指点

[github-actions]

由于缺乏足够的信息，我们暂时关闭了该 Issue。请修改（不要回复） Issue 提供最小重现以重新开启。谢谢。

[fz6m]

umi 4 按页拆包，这确保了直接访问某个页面所下载的 js 量是最少的，所以必然有 loading 过程，可以创建 src/loading.tsx 更改 loading 内容。

或者关闭拆包，但这会打包出很大的产物：https://umijs.org/docs/introduce/faq#%E5%8F%AF%E4%BB%A5%E5%85%B3%E9%97%AD-dynamicimport-%E5%90%97

[DroganC]

因为layout作为首页加载， 应该有特定的loading.
我可以用插件api来做首次白屏处理，但是白屏过后加载layout那一层，还是会出现转圈；
layout的loading应该和页面loading分开。
能够给一个配置，用来区分页面是否进行拆包？

[DroganC]

因为layout作为首页加载， 应该有特定的loading. 我可以用插件api来做首次白屏处理，但是白屏过后加载layout那一层，还是会出现转圈； layout的loading应该和页面loading分开。 能够给一个配置，用来区分页面是否进行拆包？

@fz6m 大佬

[fz6m]

1. 全局加载组件：加载的组件是 src/loading.tsx ，这是一个全局默认 loading 组件的约定，在这里面导出 loading 组件后就会用到所有异步加载的位置，只要这个确定应该就没问题了。

2. 不想要 loading ：如果你不想要全局的 loading ，就不要写这个文件，但由于默认按页拆包，第一次进入和换页加载新的页面分包，会白屏，为了避免这个问题，目前 内置的解决方案 feat: add transition router feature #11364 还没合入，但你可以在 layout 里用 这个 hook 来避免切换页面 loading 或变白，注意只能用于 react 18 。

3. 页面第一次进入的 loading ：第一次进入页面，所有 js 都没加载好，应用没启动起来，自然连应用内的 loading 都显示不了，这可能发生在产物 js 特别大的情况，需要加载比较旧，可以通过改产物 html 人工加 loading 来提升体验。

4. 如何不拆包：如同上面回复中，需要用 额外的 babel 插件 关闭按页拆包，会得到一个很大的 umi.js 产物。