gaearon / gaearon/react-hot-loader

Ignored an update to unaccepted module - Webpack 4

Open
#1,287 8 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
Upgraded Webpack from V2 and react-transform-hmr to Webpack V4 with react-hot-loader, but I'm getting:

> Ignored an update to unaccepted module
> [HMR] The following modules couldn't be hot updated: (Full reload needed)

### Expected behavior
I'm expecting that JS files do hot reload and not require a full reload.
Maybe this is an issue with my configuration, but I've tried everything so far and can't find an actual answer.
Hot reload works on SCSS files, but not on JS files.

### Actual behavior

> Ignored an update to unaccepted module
> [HMR] The following modules couldn't be hot updated: (Full reload needed)

### Environment

React Hot Loader version: 4.12.0

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

1. `node -v`: v8.10.0
2. `npm -v`: v5.6.0

Then, specify:

1. Operating system: Windows 10
2. Browser and version: Chrome 75.0.3770.100

### webpack.config.js

Entry:

```
webpackConfig.entry = {
app: __DEV__ ?
['react-hot-loader/patch', APP_ENTRY_PATH, `webpack-hot-middleware/client?path=${config.compiler.publicPath}__webpack_hmr`] :
[APP_ENTRY_PATH],
};
```

JS files loader:

```
webpackConfig.module.rules = [{
test: /\.(js|jsx)$/,
exclude: [/(node_modules)/, /lib/],
use: [{
loader: 'babel-loader',
options: {
cacheDirectory: true,
}
}]
}];
```

### .babelrc

```
{
"presets": [
[
"@babel/preset-env",
{
"targets": {
"ie": "11"
}
}
],
"@babel/preset-react",
"@babel/preset-flow"
],
"plugins": [
"react-hot-loader/babel",
[
"@babel/plugin-proposal-decorators",
{
"legacy": true
}
],
[
"@babel/plugin-proposal-class-properties",
{
"loose": true
}
],
"@babel/plugin-syntax-dynamic-import",
"@babel/plugin-transform-runtime",
[
"@babel/plugin-proposal-object-rest-spread",
{
"useBuiltIns": true
}
]
],
"env": {
"test": {
"presets": [
[
"@babel/preset-env",
{
"targets": {
"node": "current"
}
}
],
"@babel/preset-react",
"@babel/preset-flow"
],
"plugins": [
"@babel/plugin-transform-modules-commonjs",
"transform-amd-to-commonjs",
[
"@babel/plugin-proposal-class-properties",
{
"loose": true
}
],
"dynamic-import-node"
]
},
"production": {
"plugins": [
"transform-react-remove-prop-types",
"transform-react-constant-elements"
]
}
}
}
```

### Root component exported

`export default hot(Root);`

Contributor guide

Open the contributing guide

Assessment

This issue has not been assessed yet.

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.