Stuck on an issue?

Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.

And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.

NextJS Hot Reload

See original GitHub issue

What version of Next.js are you using?

12.0.2

What version of Node.js are you using?

14.17.1

What browser are you using?

Chrome

What operating system are you using?

macOS

How are you deploying your application?

Local

Describe the Bug

NextJS keeps refreshing when code is updated, the log below shows what happens

I’ve read about the warning in other issues, but didn’t have it prior to upgrading to next 12

while _devMiddlewareManifest is new

couldn’t reproduce due to the fact the project is actually big and was working fine prior to upgrading any update is causing a refresh

Expected Behavior

The page shouldn’t be refreshing

To Reproduce

Upgraded to next 12.0.2 and used a middleware in a subfolder (nothing else)

Issue Analytics

State:
Created 2 years ago
Reactions:15
Comments:7 (3 by maintainers)

Top GitHub Comments

9reactions

njarraudcommented, Nov 3, 2021

I don’t know if it is related, but I have the exact same issue when I include a “_document.tsx” file in my pages directory. Any code modification in my components triggers a full reload of the page. When “_document.tsx” is removed, hot reloads work as intended.

Even the default _document example from the vercel website triggers the same full reload behaviour.

Next.js 12.0.0 & 12.0.2

7reactions

zifeocommented, Nov 2, 2021

I was about to submit the same issue. There are multiple unexpected behaviours:

happens randomly every 4-5 fast refreshes on heavy NextJS apps and every 30-40 on small apps (on my side)
seems to happen because one of the middleware was recompiled: full reload seems fair in that case, but there is no reason why the middleware was recompiled while only a page was updated
the error message should be updated to include the middleware cause, maybe https://github.com/vercel/next.js/pull/28866 will help

wait  - compiling...
event - compiled successfully in 223 ms (193 modules)
wait  - compiling...
event - compiled successfully in 212 ms (193 modules)
wait  - compiling...
event - compiled successfully in 185 ms (193 modules)
wait  - compiling...
event - compiled successfully in 101 ms (193 modules)
wait  - compiling...
event - compiled successfully in 284 ms (193 modules)
wait  - compiling...
event - compiled successfully in 227 ms (166 modules)
wait  - compiling /_middleware (client only)...
event - compiled successfully in 163 ms (188 modules)
wait  - compiling /...
event - compiled successfully in 76 ms (193 modules)
wait  - compiling...