gaearon / gaearon/react-hot-loader

React-Hot-Loader: AppContainer should be patched

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

Description

I'm using react-hot-loader 4.12.11, react 16.9.0, react-dom 16.9.0, react-router-dom 5.0.1, redux 4.0.4, react-redux 7.1.0 and node 10.12.0 together and it fails miserably thanks to this cryptic error "React-Hot-Loader: AppContainer should be patched". What gives? Is this some compatibility issue?

My app-client.js
```
'use strict';

import React from 'react';
import {render} from 'react-dom';
import {createStore} from 'redux';
import rootReducer from './redux/reducers';
import App from './components/App';

const store = createStore(rootReducer);

render(, document.getElementById('app'));
```

App.js
```
'use strict';

import React from 'react';
import {hot} from 'react-hot-loader/root';
import PropTypes from 'prop-types';
import {BrowserRouter, Route} from 'react-router-dom';
import OverviewPage from './OverviewPage';
import {Provider} from 'react-redux';

const App = ({store}) => (



);

App.propTypes = {
store: PropTypes.object.isRequired
}

export default hot(App);
```

In package.json
```
"@hot-loader/react-dom": "^16.9.0",
"react": "^16.9.0",
"react-hot-loader": "^4.12.11",
"react-redux": "^7.1.0",
"react-router": "^5.0.1",
"react-router-dom": "^5.0.1",
"redux": "^4.0.4"
```

Contributor guide

Open the contributing guide

Research direction

Read app-client.js and App.js first, then compare their render and export setup with the package versions listed in package.json. Reproduce the “AppContainer should be patched” error using the stated React, React DOM, and react-hot-loader versions; done means the compatibility cause and a verified resolution are identified.

Written by the indexing model from the issue text.

Assessment

Tech stack
javascript, react, redux
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.