[Fixed] Next.js App reloads frequently in production

Issue

I’ve just deployed my first Next.js app in production through Nginx and pm2. Everything seems okay but the app frequently reloads after some interval on browser. I’m seeing the webpack-hmr is also running in my production server. (Which I think isn’t necessary in production)

I am using a custom server.js and I run my app on production using next build then NODE_ENV=production node server.js command, and restarting my server using pm2.

I’ve added below a screenshot of my dev-tool’s network tab which is showing the HMR running on production. If HMR is the possible cause of browser reload, then what should I do to disable it on production?

And also if the “frequent reload” isn’t happening because of HMR then what will be the cause of it?

Screenshot of my network tab of devtools showing HMR running

Have you guys experienced the same issue on production? If so, please share your knowledge and experience. Thanks.

Edit: I am also using next-pwa and a warning keeps showing on my console for it –

GenerateSW has been called multiple times, perhaps due to running webpack in –watch mode. The precache manifest generated after the first call may be inaccurate! Please see https://github.com/GoogleChrome/workbox/issues/1790 for more information.

Solution

Finally found a solution. I had to tell my env mode when starting pm2 as pm2 start server --env production. And it works perfectly on my browser.

Leave a Reply

(*) Required, Your email will not be published