Invalid HMR message..Error: No router instance found. ???

What version of Next.js are you using?

12.0.1

What version of Node.js are you using?

17.0.1

What browser are you using?

Chrome / Safari

What operating system are you using?

macOS

How are you deploying your application?

dev

Describe the Bug

While loading in locally developed npm packages, I get a weird warning in the console: [Warning] Invalid HMR message: {"action":"sync","hash":"","warnings":[],"errors":[]} Error: No router instance found. You should only use "next/router" on the client side of your app.

This current app is a test app that has no router instance anywhere, its just one page so the error doesn’t really make sense. The npm package is adding styles to the _app.tsx (global style) and an Icon component to the index.tsx file.

Chrome gives the same warning only on initial load but the warning goes away after that

Expected Behavior

The expected behaviour would be no hmr warning

To Reproduce

Not sure how others can reproduce the error since its kinda random

[snowytime]

Its also strange cause I am not actually using the router at all in my test app 😕 like not once is useRouter called in the entire application…

[flowck]

I am facing the same issue.

• Next 12.0.2
• MacOS 11.6
• Firefox
• Node 15.2.0