question-mark
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.

Error on reloading page in the initial next.js installation

See original GitHub issue

Describe the bug I get the following error shown in the console when I reload a page in firefox: The connection to http://localhost:3000/_next/webpack-hmr was interrupted while the page was loading.

This seems to happen even with a new next.js installation.

To Reproduce

  • Create a new folder mkdir nextjs-test
  • navigate to the folder and install dependencies npm install --save next react react-dom
  • add the dev script to package.json "dev": "next"
  • create ./pages/index.js and copy the following code: export default () => <div>Welcome to next.js!</div>
  • npm run dev and open localhost:3000 in firefox.
  • Reload the browser and open the console. The error should show up in your console.

Expected behavior I expect no error since I only followed the basic setup.

System information

  • OS: macOS
  • Browser: firefox 60.0.1 (no error when using chrome)
  • Version of Next.js: 6.0.3

Issue Analytics

  • State:closed
  • Created 5 years ago
  • Reactions:11
  • Comments:15 (5 by maintainers)

github_iconTop GitHub Comments

6reactions
Nicolas-Menettriercommented, Oct 22, 2019

Same, only with firefox.

5reactions
adam-beckcommented, Nov 22, 2019

@timneutkens can this issue be reopened? Or should we create a new one, separate for Firefox issues?

Read more comments on GitHub >

github_iconTop Results From Across the Web

Nextjs 404 error on reload/ refresh action
I had got similar issue in react when all of my pages after building and exporting had ".html" extensions. I solved it by...
Read more >
Advanced Features: Error Handling
Handling Errors in Development​​ js application, you will encounter an overlay. It is a modal that covers the webpage. It is only visible...
Read more >
Basic Features: Fast Refresh
Next.js' Fast Refresh is a new hot reloading experience that gives you instantaneous feedback on edits made to your React components.
Read more >
react-hydration-error
In general this issue is caused by using a specific library or application code that is relying on something that could differ between...
Read more >
getInitialProps - Data Fetching
Enable Server-Side Rendering in a page and do initial data population with ... err - Error object if any error is encountered during...
Read more >

github_iconTop Related Medium Post

No results found

github_iconTop Related StackOverflow Question

No results found

github_iconTroubleshoot Live Code

Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start Free

github_iconTop Related Reddit Thread

No results found

github_iconTop Related Hackernoon Post

No results found

github_iconTop Related Tweet

No results found

github_iconTop Related Dev.to Post

No results found

github_iconTop Related Hashnode Post

No results found