gaearon / gaearon/react-hot-loader

It doesn't work with React.lazy

Open
#1,425 15 comments 0 reactions 0 assignees View on GitHub
Dominant language
JavaScript
Stars
12.2k
Forks
775
PR merge metrics
No merged PRs in 30d

Description

If you are reporting a bug or having an issue setting up React Hot Loader, please fill in below. For feature requests, feel free to remove this template entirely.

### Description

What you are reporting: when I user React.lazy, it doesn't work

### Expected behavior

What you think should happen: state can remain

### Actual behavior

What actually happens: state can't remain

### Environment

React Hot Loader version: 4.12.19
"devDependencies": {
"@babel/core": "^7.8.3",
"@babel/plugin-proposal-class-properties": "^7.8.3",
"@babel/plugin-proposal-decorators": "^7.8.3",
"@babel/plugin-transform-runtime": "^7.8.3",
"@babel/preset-env": "^7.8.3",
"@babel/preset-react": "^7.8.3",
"babel-loader": "^8.0.6",
"express": "^4.17.1",
"html-webpack-plugin": "^3.2.0",
"webpack": "^4.41.5",
"webpack-cli": "^3.3.10",
"webpack-dev-middleware": "^3.7.2",
"webpack-dev-server": "^3.10.3",
"webpack-hot-middleware": "^2.25.0"
},
"dependencies": {
"@babel/runtime-corejs3": "^7.8.3",
"connected-react-router": "^6.7.0",
"history": "^4.10.1",
"prop-types": "^15.7.2",
"react": "^16.12.0",
"react-dom": "^16.12.0",
"react-hot-loader": "^4.12.19",
"react-redux": "^7.1.3",
"react-router-dom": "^5.1.2",
"redux": "^4.0.5",
"redux-thunk": "^2.3.0"
}

Run these commands in the project folder and fill in their results:

1. `node -v`: v12.15.0
2. `npm -v`: 6.13.4

Then, specify:

1. Operating system: mac os
2. Browser and version: chrome

### Reproducible Demo

Please take the time to create a new project that reproduces the issue.

You can copy your project that experiences the problem and start removing things until you’re left with the minimal reproducible demo. This helps contributors, and you might get to the root of your problem during that process.

Push to GitHub and paste the link here.

you can use my project and reappear it : https://github.com/rainydayDY/webpack-fe

Contributor guide

Open the contributing guide

Research direction

Start by reproducing the reported behavior in the linked webpack-fe project with React.lazy and React Hot Loader 4.12.19. Compare the component state before and after lazy loading, and consider the issue complete only when state remains preserved in the minimal reproduction.

Written by the indexing model from the issue text.

Assessment

Tech stack
javascript, react, webpack
Domain
frontend
Issue type
Bug
Difficulty
4/5
Estimated time
3-5 days
Activity status
Stale
Clarity
Needs clarification
Newbie friendliness
25/100

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.