gaearon / gaearon/react-hot-loader
React warning: componentWillMount has been renamed, and is not recommended for use.
- 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
I've started to get this warning message from React.
```
Warning: componentWillMount has been renamed, and is not recommended for use. See https://fb.me/react-unsafe-component-lifecycles for details.
```
I don't use this method `componentWillMount ` on my code. I don't know exactly since when I'm getting this message. I've updated (React included), installed and removed some packages over the last few days.
I've asked about it on SO, but sill no answer.
https://stackoverflow.com/questions/58891130/how-to-find-out-which-package-is-using-the-unsafe-componentwillmount-method?noredirect=1#comment104047811_58891130
**Obs:** The full error message is on the SO question.
I opened a new VSCode window and opened my `node_modules` folder to search inside of its files and found this:
**react-lifecycles-compat.js**
```
function componentWillMount() {
// Call this.constructor.gDSFP to support sub-classes.
var state = this.constructor.getDerivedStateFromProps(this.props, this.state);
if (state !== null && state !== undefined) {
this.setState(state);
}
}
```
Also this is in my `package-lock.json`
```
"react-hot-loader": {
"version": "4.12.17",
"resolved": "https://registry.npmjs.org/react-hot-loader/-/react-hot-loader-4.12.17.tgz",
"integrity": "sha512-nee5q4Xip6+wD8DrCWxVUH0zT488K1zRG1KezJTb8oEbRO1JZvnEizbOG7BwnRfxxjk5QSyx6fPXeBf2fToBhw==",
"dev": true,
"requires": {
"fast-levenshtein": "^2.0.6",
"global": "^4.3.0",
"hoist-non-react-statics": "^3.3.0",
"loader-utils": "^1.1.0",
"prop-types": "^15.6.1",
"react-lifecycles-compat": "^3.0.4", // < ------------------------------
"shallowequal": "^1.1.0",
"source-map": "^0.7.3"
},
```
**QUESTION**
Could this warning be related to this library that `react-hot-loader` requires?
### Expected behavior
This warning shouldn't be happening.
### Actual behavior
The warning.
### Environment
React Hot Loader version:
**package.json**
```
"devDependencies": {
"@babel/cli": "^7.7.0",
"@babel/core": "^7.7.2",
"@babel/node": "^7.7.0",
"@babel/preset-env": "^7.7.1",
"@babel/preset-react": "^7.7.0",
"babel-eslint": "^10.0.3",
"babel-loader": "^8.0.6",
"babel-plugin-module-resolver": "^3.2.0",
"babel-plugin-styled-components": "^1.10.6",
"clean-webpack-plugin": "^3.0.0",
"css-loader": "^3.2.0",
"dotenv-webpack": "^1.6.0",
"eslint": "^6.6.0",
"eslint-import-resolver-alias": "^1.1.2",
"eslint-module-utils": "^2.4.1",
"eslint-plugin-import": "^2.18.2",
"eslint-plugin-react": "^7.16.0",
"eslint-plugin-react-hooks": "^2.2.0",
"file-loader": "^4.2.0",
"firebase-admin": "^8.7.0",
"html-webpack-plugin": "^3.2.0",
"react-hot-loader": "^4.12.17",
"rimraf": "^3.0.0",
"style-loader": "^1.0.0",
"url-loader": "^2.2.0",
"webpack": "^4.41.2",
"webpack-bundle-analyzer": "^3.6.0",
"webpack-cli": "^3.3.10",
"webpack-dev-server": "^3.9.0",
"webpack-manifest-plugin": "^2.2.0",
"webpack-merge": "^4.2.2"
},
"dependencies": {
"@babel/polyfill": "^7.7.0",
"@hot-loader/react-dom": "^16.11.0",
"animejs": "^3.1.0",
"firebase": "^7.3.0",
"fuse.js": "^3.4.5",
"md5": "^2.2.1",
"prop-types": "^15.7.2",
"query-string": "^6.8.3",
"react": "^16.11.0",
"react-dom": "^16.11.0",
"react-helmet": "^5.2.1",
"react-router-dom": "^5.1.2",
"react-transition-group": "^4.3.0",
"styled-components": "^4.4.1"
},
```
Run these commands in the project folder and fill in their results:
1. `node -v`: 10.16.2
2. `npm -v`: 6.9.0
Then, specify:
1. Operating system: Windows 10
2. Browser and version: Chrome v78
### 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.
Contributor guide
Assessment
This issue has not been assessed yet.