Next.js 应用在生产环境中频繁重新加载

Posted 2023-02-22

【中文标题】Next.js 应用在生产环境中频繁重新加载

【英文标题】：Next.js App reloads frequently in production

【发布时间】：2020-09-25 05:24:34

【问题描述】：

我刚刚通过 nginx 和 pm2 在生产环境中部署了我的第一个 Next.js 应用程序。一切似乎都还好，但应用程序在浏览器上经过一段时间后经常重新加载。我看到webpack-hmr 也在我的production 服务器中运行。 （我认为在生产中没有必要）

我正在使用自定义的server.js，我使用next build 然后NODE_ENV=production node server.js 命令在生产环境中运行我的应用程序，并使用pm2 重新启动我的服务器。

我在我的开发工具网络选项卡的屏幕截图下方添加了一个屏幕截图，它显示了在 production 上运行的 HMR。如果HMR 是浏览器重新加载的可能原因，那么我应该如何在生产环境中禁用它？

此外，如果由于 HMR 而没有发生“频繁重新加载”，那么导致它的原因是什么？

你们在生产中遇到过同样的问题吗？如果是这样，请分享您的知识和经验。谢谢。

编辑：我也在使用next-pwa，并且我的控制台上一直显示警告-

GenerateSW 已被多次调用，可能是由于在 --watch 模式下运行 webpack。第一次调用后生成的预缓存清单可能不准确！请参阅https://github.com/GoogleChrome/workbox/issues/1790 了解更多信息。

【参考方案1】：

终于找到了解决办法。当以pm2 start server --env production 启动 pm2 时，我必须告诉我的环境模式。它在我的浏览器上完美运行。

【参考方案2】：

通过在开发时禁用 pwa 来修复它

const prod = process.env.NODE_ENV === 'production'

module.exports = withPWA(
            pwa: 
                dest: 'public',
                disable: prod ? false : true
                
             )