问题
I am trying to implement react-hot-loader
in my existing application. I followed the tutorial, and used the boilerplate file from this link as suggested in the tutorial. Then, when I start the node server using yarn start
, I get the following error:
ERROR in (webpack)-dev-server/client?http://0.0.0.0:3000
Module not found: Error: Cannot resolve module 'webpack/hot/emitter' in /Users/Rai/Documents/github/sarvahitey-core/client/node_modules/webpack-dev-server/client
@ (webpack)-dev-server/client?http://0.0.0.0:3000 153:19-49
Child extract-text-webpack-plugin:
chunk {0} extract-text-webpack-plugin-output-filename 1.78 kB [rendered]
[0] ./~/css-loader?modules=true&localIdentName=[name]__[local]___[hash:base64:5]!./app/client/components/navbar/navbar.css 274 bytes {0} [built]
[1] ./~/css-loader/lib/css-base.js 1.51 kB {0} [built]
webpack: Failed to compile.
Here is my webpack config file:
var ExtractTextPlugin = require('extract-text-webpack-plugin');
var combineLoaders = require('webpack-combine-loaders');
var webpack = require('webpack');
module.exports = {
context: __dirname,
entry: [
'webpack-dev-server/client?http://0.0.0.0:3000', // WebpackDevServer host and port
'webpack/hot/only-dev-server', // "only" prevents reload on syntax errors
'./app/StartUp.js'
],
output: {
path: __dirname + "/../app/assets/webpack",
filename: "[name].js"
},
resolve: {
extensions: ['', '.js', '.jsx', '.css'],
},
module: {
loaders: [
{ test: /\.jsx?$/,
loaders: ['react-hot','babel?presets[]=es2015,presets[]=stage-0,presets[]=react,plugins[]=transform-runtime'],
exclude: /node_modules/
},
{
test: /\.css$/,
loader: ExtractTextPlugin.extract(
'style-loader',
combineLoaders([{
loader: 'css-loader',
query: {
modules: true,
localIdentName: '[name]__[local]___[hash:base64:5]'
}
}])
)
}
]
},
plugins: [
new ExtractTextPlugin("main.css"),
new webpack.HotModuleReplacementPlugin()
]
};
And my package.json
file has the following config:
{
"dependencies": {
"babel-core": "^6.22.1",
"babel-loader": "^6.2.10",
"babel-plugin-transform-runtime": "^6.22.0",
"babel-polyfill": "^6.22.0",
"babel-preset-es2015": "^6.22.0",
"babel-preset-react": "^6.22.0",
"babel-preset-stage-0": "^6.22.0",
"babel-runtime": "^6.22.0",
"css-loader": "^0.26.1",
"extract-text-webpack-plugin": "^1.0.1",
"react": "^15.4.2",
"react-dom": "^15.4.2",
"react-on-rails": "^6.4.2",
"react-redux": "^5.0.2",
"react-router": "^3.0.2",
"style-loader": "^0.13.1",
"webpack": "^1.14.0",
"webpack-combine-loaders": "^2.0.3",
"webpack-dev-server": "^2.3.0"
},
"devDependencies": {
"react-hot-loader": "^1.3.1",
"webpack-dev-middleware": "^1.10.0",
"webpack-hot-middleware": "^2.16.1"
},
"scripts": {
"start": "node server.js"
}
}
Any ideas why I am getting the above error? I tried to google the same but couldn't find anything for Cannot resolve module 'webpack/hot/emitter'
.
回答1:
If you want use webpack@1.14, please install webpack-dev-server@1.16.3 instead.
来源:https://stackoverflow.com/questions/42107073/cannot-resolve-module-webpack-hot-emitter-while-using-hot-reloader