在使用熱備份器時無法解析模塊'webpack/hot/emitter'

Question

我正試圖在我現有的應用程序中實現react-hot-loader。我遵循tutorial，並使用本教程中建議的link的樣板文件。然後，當我開始使用yarn start節點服務器，我收到以下錯誤：

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. 

這裏是我的WebPack配置文件：

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() 
    ] 
}; 

而且我package.json文件具有以下配置：

{ 
    "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" 
    } 
} 

任何想法，爲什麼我得到上述錯誤？我試圖谷歌相同，但找不到Cannot resolve module 'webpack/hot/emitter'任何東西。

Answer 1

如果您想使用webpack@1.14，請改爲安裝webpack-dev-server@1.16.3。