使用 Vite 时 HTTP 请求停留在 Pending 状态

Question

我有一个相当大的 Vue 3 应用程序（约 550 个组件）。运行需要两分钟vue-cli-service serve，每次更改后重新构建需要大约 20 秒。热重载很久以前就停止工作了，因此即使在很小的样式更改之后，它也始终需要在浏览器中刷新。此外，该应用程序还没有完成，明年它可能会变得如此大 2-3 倍，所以它可能会更糟。

由于这些问题，我决定将其从 Vue CLI 迁移到 Vite。我已经解决了很多问题，并且该应用程序现在似乎可以与 Vite 配合使用，加载时间要短得多。

但是，当我启动开发服务器（vite命令）并在浏览器中打开它时，它有时会卡住。页面不断加载，我可以在 Chrome DevTools 的“网络”选项卡中看到很多待处理的请求。的输出没有什么特别的vite --debug，运行vite --force也没有帮助。

出现此问题时，浏览器总是加载很多模块（~900），然后卡在 10-20 个模块上。所有这些 HTTP 请求的状态都很简单Pending，而且永远不会完成。浏览器或命令行中没有错误。

我不认为任何特定文件会导致此问题。也许问题出在我的深层嵌套文件夹结构中，每个级别上都有大量使用index.ts文件的重新导出。它主要卡在我自己的模块上，但我也看到过它等待某些外部库的模块的情况。

有人遇到过类似的问题吗？你是怎么解决的？

编辑：我发现此问题仅发生在 Linux 上基于 Chromium 的浏览器（Google Chrome、Brave 等）中。它在 MacOS 和 Windows 上的 Chrome 以及 Linux 上的其他浏览器（Firefox、GNOME Web 等）中运行没有任何问题。

Answer 1

感谢这个评论，我意识到这是文件描述符限制的问题。

在 Manjaro Linux（基于 Arch）上，我可以通过将以下行添加到/etc/systemd/system.conf和/etc/systemd/user.conf文件来解决这个问题：

DefaultLimitNOFILE=65536

此次变更后，Vite在所有浏览器中都可以正常运行。