Next.js: Full reload of current page because of HMR during navigation to another one

[ex3ndr]

Bug report

Describe the bug

Navigation to another page that not yet built the full page reload invoked because of HMR with messages like:

[HMR] The following modules couldn't be hot updated: (Full reload needed)
This is usually because the modules which have changed (and their parents) do not know how to hot reload themselves. See https://webpack.js.org/concepts/hot-module-replacement/ for more details.
[HMR]  - ./packages/openland-api/MyOrganizationsQuery.ts
[HMR]  - ./packages/openland-x-graphql/graphqlCompose.tsx
[HMR]  - ./packages/openland-x-graphql/typed.ts
[HMR]  - ./packages/openland-web/api/withOrganization.ts
VM6892 main.js:35768 [HMR] Reloading page

This messages are about dependencies of current page, not the one i tried to navigate. For sure this files wasn't changed.

My setup is a little bit unusual:

• I am using typescript (with official plugin)
• I am using custom page extension: page.ts|tsx
• It is multi-package project. App is in /packages/openland-web/ folder (with next.config.js in it) and a lot of modules are in other directories like /packages/openland-api/.
• To make it work i have two hacks for webpack:
  
  
  
  • Parsing paths from tsconfig.json and updating webpack config with correct aliases
  
  
  • Adding rule for default babel loader to handle /packages/*.ts|tsx files.
  
  

Expected behavior

It should not refresh current page since nothing was changed.

System information

• Version of Next.js: next:6.0.4-canary.8

[timneutkens]

Please provide a full reproduction, preferably a minimal app in a GitHub repository. It's impossible to debug this without it 🙏

[exogen]

I'm seeing this as well and it's even more frustrating as it doesn't actually list any modules, just says "undefined" like so:

[HMR] The following modules couldn't be hot updated: (Full reload needed)
This is usually because the modules which have changed (and their parents) do not know how to hot reload themselves. See https://webpack.js.org/concepts/hot-module-replacement/ for more details.
[HMR]  - undefined
[HMR] Reloading page

Trying to build up a standalone repro case to narrow it down, but haven't been able to so far. Working on it.

[exogen]

I was able to reproduce my case above once I added the with-polyfills example code.

After removing everything else from my code, the method recommended in the with-polyfills example alone was enough to trigger the message and reload behavior for me.

[novascreen]

@timneutkens there is small issue that seems related:
A webpackHotUpdate is not defined error is thrown (reproducible with the with-polyfills example using Next.js canary)

During development this doesn't seem to be an issue, but if i want to run my tests in Cypress it becomes a problem.