Не могу настроить webpack с react-hot-loader Постоянно вылезают ошибки..
ERROR in ./src/main.js
Module build failed: ReferenceError: Unknown plugin "react-hot-loader/babel"
ERROR in multi react-hot-loader/patch webpack-hot-middleware/client ./src/main.js
Module not found: Error: Can't resolve 'react-hot-loader/patch'
Сам webpack :
const webpack = require('webpack');
const path = require('path');
const rules = [
{
test: /\.(js|jsx)$/,
exclude: /node_modules/,
use:[
{
loader: 'babel-loader',
options: {
plugins: ['react-hot-loader/babel'],
}
}
]
}
];
const plugins = [
new webpack.HotModuleReplacementPlugin()
];
module.exports = {
devtool: 'source-map',
entry: {
app:[
'react-hot-loader/patch',
'webpack-hot-middleware/client',
'./src/main.js'
]
},
output: {
filename: '[name].bundle.js',
publicPath: '/',
path: path.resolve(__dirname, 'dist'),
},
module: {
rules
},
resolve:{
extensions:['.js', '.jsx'],
},
plugins
}
app.js
app.use(webpackDevMiddleware(compiler,{
stats:{
colors: true,
hash: false,
timings: true,
chunks: false,
chunkModules: false,
modules: false
}
}));
app.use(webpackHotMiddleware(compiler));
.babelrc:
{
"presets": [["es2015"], ["react"]],
"plugins": ["react-hot-loader/babel"]
}
main.js
import React from 'react'
import ReactDOM from 'react-dom'
import { AppContainer } from 'react-hot-loader';
import App from './components/App'
const render = Component => {
ReactDOM.render(
<AppContainer>
<Component />
</AppContainer>,
document.getElementById('root')
)
}
render(App)
if (module.hot) {
module.hot.accept('./containers/App', () => { render(App) })
}
В чем проблема?
