VIte / React 项目中有些块缩小后大于 500 kBs

Question

当我跑步时

npm run build

我收到这个警告：

(!) Some chunks are larger than 500 kBs after minification. Consider:

- Using dynamic import() to code-split the application

- Use build.rollupOptions.output.manualChunks to improve chunking: https://rollupjs.org/configuration-options/#output-manualchunks

- Adjust chunk size limit for this warning via build.chunkSizeWarningLimit.

✓ built in 4.03s

我实际上尝试实现延迟加载，但它不起作用，如何在不修改块的情况下解决这个问题。

Answer 1

代码分割可以通过“将代码分割成自己的较小版本”来解决，而不是拥有 200 行的文件，您可以将其分割为 4 个文件，每个文件 50 行。 另外，您可以尝试使用 React 的文档示例进行延迟加载：

import { lazy } from 'react';
const MarkdownPreview = lazy(() => import('./MarkdownPreview.js'));

用途：

<Suspense fallback={<MyLoadingComponent />}>
    <MarkdownPreview />
</Suspense>