React Hot Loader - Ignored an update to unaccepted module

I am new to React and React Hot Loader. I have a Symfony 2.7 application and started to use webpack and react.

In general everything works fine, but when I want to use Hot Reloading, I get the error:

Ignored an update to unaccepted module ./app/Resources/js/app.js -> 0
[HMR] The following modules couldn't be hot updated: (They would need a full reload!)
[HMR]  - ./app/Resources/js/app.js

Am I missing anything basic here. I am pretty new so it might be an easy answer to the problem. Thanks a lot

Here is my basic code:

package.json

"dependencies": {
    "babel-core": "^6.25.0",
    "babel-loader": "^7.1.1",
    "babel-preset-es2015": "^6.24.1",
    "babel-preset-react": "^6.24.1",
    "babel-preset-stage-0": "^6.24.1",
    "babel-preset-stage-2": "^6.24.1",
    "react": "^15.6.1",
    "react-dom": "^15.6.1",
    "react-hot-loader": "^1.3.1",
    "webpack-dev-server": "^2.6.1"
  }

app.js

import React from 'react';
import ReactDOM from 'react-dom';
// import ReactHotLoader from 'react-hot-loader';
import Component from './component.js';

// const element = ;
ReactDOM.render(
    <h1>Hello, world app </h1>
    ,
    document.getElementById('app')
);

webpack.config.js:

var path = require('path');
var webpack = require('webpack');
var node_modules_dir = path.join(__dirname, 'node_modules');

var config = {
    entry: [
        'webpack-dev-server/client?http://127.0.0.1:3000',
        'webpack/hot/only-dev-server',
        './app/Resources/js/app.js',
    ],
    output: {
        path: path.join(__dirname, 'web/dist'),
        filename: 'bundle.js',
        publicPath: 'http://127.0.0.1:3000/static/'
    },

    plugins: [
        new webpack.HotModuleReplacementPlugin(),
        new webpack.NoEmitOnErrorsPlugin(),

    ],
    module: {
        loaders: [
            {
                test: /\.js?$/,
                include: path.join(__dirname, 'app/Resources/js'),
                loader: "babel-loader",
                query: {
                        presets:['react']
                }
            }
        ]
    }
};

module.exports = config;

Output when starting the webpack dev server:

node webpack.dev-server.js l
Listening at 0.0.0.0:3000
Hash: 8c2dd25b4ae931392c17
Version: webpack 3.4.1
Time: 1977ms
    Asset     Size  Chunks                    Chunk Names
bundle.js  1.09 MB       0  [emitted]  [big]  main
  [50] (webpack)/hot/log.js 1.04 kB {0} [built]
  [85] ./node_modules/react/react.js 56 bytes {0} [built]
 [118] multi webpack-dev-server/client?http://127.0.0.1:3000 webpack/hot/only-dev-server ./app/Resources/js/app.js 52 bytes {0} [built]
 [119] (webpack)-dev-server/client?http://127.0.0.1:3000 5.83 kB {0} [built]
 [120] ./node_modules/url/url.js 23.3 kB {0} [built]
 [126] ./node_modules/strip-ansi/index.js 161 bytes {0} [built]
 [128] ./node_modules/loglevel/lib/loglevel.js 6.74 kB {0} [built]
 [129] (webpack)-dev-server/client/socket.js 856 bytes {0} [built]
 [161] (webpack)-dev-server/client/overlay.js 3.6 kB {0} [built]
 [166] (webpack)/hot nonrecursive ^\.\/log$ 170 bytes {0} [built]
 [168] (webpack)/hot/only-dev-server.js 2.37 kB {0} [built]
 [169] (webpack)/hot/log-apply-result.js 1.31 kB {0} [built]
 [170] ./app/Resources/js/app.js 295 bytes {0} [built]
 [186] ./node_modules/react-dom/index.js 59 bytes {0} [built]
 [272] ./app/Resources/js/component.js 255 bytes {0} [built]
    + 258 hidden modules
webpack: Compiled successfully.

Recommended topics

Hot tags