每次我试图给它一个成为我朋友的机会时,我都遇到了 webpack 的问题!这次我尝试使用 react-hot-loader、webpack 和 webpack-dev-server 启用热模块重新加载,但似乎 webpack-dev-server 试图在浏览器中获取错误的 url。
这是来自 Chrome v50 控制台的错误:
GET http://public/info?t=1464117419740 net::ERR_NAME_NOT_RESOLVED
完整的日志:
abstract-xhr.js:132 GET http://public/info?t=1464117419740 net::ERR_NAME_NOT_RESOLVEDAbstractXHRObject._start @ abstract-xhr.js:132(anonymous function) @ abstract-xhr.js:21
index.js:70 [WDS] Disconnected!sock.onclose @ index.js:70EventTarget.dispatchEvent @ eventtarget.js:51(anonymous function) @ main.js:356
abstract-xhr.js:132 GET http://public/info?t=1464117421752 net::ERR_NAME_NOT_RESOLVEDAbstractXHRObject._start @ abstract-xhr.js:132(anonymous function) @ abstract-xhr.js:21
这是我的 webpack 配置:
{
devtool: 'source-map',
entry: [
// 'webpack-dev-server/client?path=http://localhost:3001/', // I have tested it with no luck
'webpack-hot-middleware/client?path=http://localhost:3001/',
'webpack/hot/dev-server',
'./index.js'
],
output: {
path: path.join(__dirname, 'public'),
publicPath: '/public/',
filename: 'bundle.js'
},
plugins: [
new webpack.HotModuleReplacementPlugin(),
new ExtractTextPlugin('index.css', {
allChunks: true
})
],
postcss: [
values,
cssnext
],
devServer: {
hot: true,
inline: true,
contentBase: './'
}
module: {
loaders: [
{
test: /\.js$/,
loaders: ['react-hot','babel'],
exclude: /node_modules/
},
{
test: /\.(css)$/,
exclude: /node_modules/,
loader: ExtractTextPlugin.extract('style', 'css?modules&importLoaders=1&localIdentName=[name]__[local]___[hash:base64:5]!postcss')
},
{
test: /\.(eot|woff|woff2|ttf|svg|png|jpe?g|gif)(\?\S*)?$/,
loader: 'file'
}
]
}
}