根据工作要求调整环境后热重载停止工作

Question

几天前，我开始担任新的开发人员角色，并进行了一些环境更改以适应工作。从那时起，我的热重载/快速刷新就完全停止工作了。即使我手动刷新页面，更改也不会显示。仅当我停止开发服务器并使用“npm run dev”重新启动它时才显示更改。右下角的三角形指示器应该处于活动状态，显示窗口的主动重新加载（这也不再一致显示，如果确实如此，页面会重新加载，但遗憾的是建议的更改不可见）

语境：

• 它对我的所有 NextJS 和 React 应用程序都有这种影响。即使从 NextJS 示例页面运行基本项目模板也显示热重载不起作用。
• 我研究了这个问题，似乎错误的导入（例如使用小写字母导入组件或页面目录中的文件大写）可能会导致此问题，但我梳理了代码并且无法发现任何问题（当然，我可能会错过它）但我的代码库有超过 300 个文件）。
• 后台的服务人员可能会导致问题，但我清除了浏览器中的所有问题以确保它仍然无法解决问题。
• 我安装了 ngrok 用于工作目的隧道，并安装了 docker-compose 来处理工作开发。环境。
• 确保我使用的是最新的 Next 版本。甚至删除了node_modules并运行了npm install。删除了 .next 和 out 文件夹，但仍然没有成功。

有人对我下一步应该尝试什么有任何想法或线索吗？与我工作时安装的东西有关吗？与 VS code 或 WSL2 相关的东西吗？看起来很令人费解，这似乎是在一夜之间发生的。感谢您的任何见解或建议！

系统信息 操作系统：Windows（VS代码的WSL2虚拟化） 浏览器：Chrome Next.js版本：10.0.3 Node.js版本：14.8.0 部署：npm run dev用于开发工作；为 AWS 托管放大发布

Answer 1

问题出在 WSL2 上。我在 VS Code 中使用 WSL2；这是Linux环境下性能的一大提升。问题是 WSL2 实际上处于“虚拟化”状态，因此无法同时从 VS Code 和浏览器 (localhost:3000) 发送信息。

这是他们正在解决的一个大问题，目前还没有解决办法。这就是快速刷新不起作用的原因，因为本地主机没有收到所做的更改。通过代理或恢复到 WSL1 https://github.com/microsoft/WSL/issues/4769

_{OP在问题部分提供的解决方案}

Answer 2

添加一个.env文件或一个.env.local文件到你的根目录并在上面添加以下行：

WATCHPACK_POLLING=true 

现在，重新启动您的服务器。