Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Full reload of current page because of HMR during navigation to another one #4643

Closed
ex3ndr opened this issue Jun 21, 2018 · 4 comments · Fixed by #4738
Closed

Full reload of current page because of HMR during navigation to another one #4643

ex3ndr opened this issue Jun 21, 2018 · 4 comments · Fixed by #4738

Comments

@ex3ndr
Copy link
Contributor

ex3ndr commented Jun 21, 2018

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
Copy link
Member

timneutkens commented Jun 21, 2018

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

@exogen
Copy link
Contributor

exogen commented Jun 24, 2018

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
Copy link
Contributor

exogen commented Jun 24, 2018

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
Copy link
Contributor

@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)

image

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

@lock lock bot locked as resolved and limited conversation to collaborators Aug 28, 2019
Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
Labels
None yet
Projects
None yet
Development

Successfully merging a pull request may close this issue.

4 participants