Webpack hmr net::ERR_INCOMPLETE_CHUNKED_ENCODING
Webpack hmr net::ERR_INCOMPLETE_CHUNKED_ENCODING
加载时一切正常,hmr 正在运行。然后出现这个错误。
GET http://localhost:3000/__webpack_hmr net::ERR_INCOMPLETE_CHUNKED_ENCODING
这就像 webpackdevserver 有点崩溃然后重新启动,需要几秒钟然后 hmr 再次工作
[HMR] connected
然后 'crash' 等等...
我好像只有Chrome(55版)有这个问题(用mozilla测试过,没有出现这个问题)
我可能在我的 webpack 或 node conf 中遗漏了一些东西,但在文档中找不到。
知道如何解决这个问题吗?
//在 webpack conf 下方
const path = require('path');
const merge = require('webpack-merge');
const TARGET = process.env.NODE_ENV;
process.env.BABEL_ENV = TARGET;
const webpack = require('webpack');
const NpmInstallPlugin = require('npm-install-webpack-plugin');
const PATHS = {
app: path.join(__dirname, 'client'),
build: path.join(__dirname, 'build')
};
const common = {
entry: {
app: [PATHS.app, 'webpack-hot-middleware/client']
},
resolve: {
extensions: ['', '.js', '.jsx']
},
output: {
path: PATHS.build,
filename: 'bundle.js',
publicPath: '/'
},
module: {
loaders: [
{
test: /\.css$/,
loaders: ['style', 'css'],
include: PATHS.app
},
{
test: /\.jsx?$/,
loaders:['babel?cacheDirectory=true'],
include: PATHS.app
}
]
}
};
if(TARGET === 'dev' || ! TARGET) {
module.exports = merge(common, {
// devServer: {
// contentBase: PATHS.build,
// historyApiFallback: true,
// hot: true,
// inline: true,
// progress: true,
// stats: 'error-only',
// host: 'http://127.0.0.1/',
// port: 3000
// },
export: {
isDev: true
},
plugins: [
new webpack.optimize.OccurrenceOrderPlugin(),
new webpack.HotModuleReplacementPlugin(),
new webpack.DefinePlugin({
'process.env.NODE_ENV': JSON.stringify('dev')
}),
new NpmInstallPlugin({
save: true
})
],
devtool: 'eval-source-map'
});
}
if(TARGET === "build") {
module.exports = merge(common, {});
}
// Nodejs 路由
this.app.get('/', function(req,res) {
res.sendFile(path.join(__dirname, './../../build/index.html'))
})
// index.html
<!DOCTYPE html>
<html>
<head>
<title> Ripple Data Analyzer</title>
</head>
<body>
<div id='root'>
</div>
<script src="bundle.js"></script>
</body>
</html>
//index.js
import React from 'react';
import ReactDOM from 'react-dom';
import App from './components/App.jsx';
ReactDOM.render(<App/>, document.getElementById('root'));
真正的原因是我在我的节点服务器上设置了 setTimeout
server.timeout = 100;
我建议你更新 node.js 到最新的 LTS 版本,因为这是在 8.1.0 版本中修复的节点错误(不确定版本)
sudo s 8.9.1
(对于linux)
伙计,我建议你更新你的节点版本,这是节点的问题link
,但要轻松解决您的问题,请按照以下步骤操作:
node -v
sudo npm cache clean -f
sudo npm i n -g
sudo n stable
node -v
再见;)
加载时一切正常,hmr 正在运行。然后出现这个错误。
GET http://localhost:3000/__webpack_hmr net::ERR_INCOMPLETE_CHUNKED_ENCODING
这就像 webpackdevserver 有点崩溃然后重新启动,需要几秒钟然后 hmr 再次工作
[HMR] connected
然后 'crash' 等等...
我好像只有Chrome(55版)有这个问题(用mozilla测试过,没有出现这个问题)
我可能在我的 webpack 或 node conf 中遗漏了一些东西,但在文档中找不到。
知道如何解决这个问题吗?
//在 webpack conf 下方
const path = require('path');
const merge = require('webpack-merge');
const TARGET = process.env.NODE_ENV;
process.env.BABEL_ENV = TARGET;
const webpack = require('webpack');
const NpmInstallPlugin = require('npm-install-webpack-plugin');
const PATHS = {
app: path.join(__dirname, 'client'),
build: path.join(__dirname, 'build')
};
const common = {
entry: {
app: [PATHS.app, 'webpack-hot-middleware/client']
},
resolve: {
extensions: ['', '.js', '.jsx']
},
output: {
path: PATHS.build,
filename: 'bundle.js',
publicPath: '/'
},
module: {
loaders: [
{
test: /\.css$/,
loaders: ['style', 'css'],
include: PATHS.app
},
{
test: /\.jsx?$/,
loaders:['babel?cacheDirectory=true'],
include: PATHS.app
}
]
}
};
if(TARGET === 'dev' || ! TARGET) {
module.exports = merge(common, {
// devServer: {
// contentBase: PATHS.build,
// historyApiFallback: true,
// hot: true,
// inline: true,
// progress: true,
// stats: 'error-only',
// host: 'http://127.0.0.1/',
// port: 3000
// },
export: {
isDev: true
},
plugins: [
new webpack.optimize.OccurrenceOrderPlugin(),
new webpack.HotModuleReplacementPlugin(),
new webpack.DefinePlugin({
'process.env.NODE_ENV': JSON.stringify('dev')
}),
new NpmInstallPlugin({
save: true
})
],
devtool: 'eval-source-map'
});
}
if(TARGET === "build") {
module.exports = merge(common, {});
}
// Nodejs 路由
this.app.get('/', function(req,res) {
res.sendFile(path.join(__dirname, './../../build/index.html'))
})
// index.html
<!DOCTYPE html>
<html>
<head>
<title> Ripple Data Analyzer</title>
</head>
<body>
<div id='root'>
</div>
<script src="bundle.js"></script>
</body>
</html>
//index.js
import React from 'react';
import ReactDOM from 'react-dom';
import App from './components/App.jsx';
ReactDOM.render(<App/>, document.getElementById('root'));
真正的原因是我在我的节点服务器上设置了 setTimeout
server.timeout = 100;
我建议你更新 node.js 到最新的 LTS 版本,因为这是在 8.1.0 版本中修复的节点错误(不确定版本)
sudo s 8.9.1
(对于linux)
伙计,我建议你更新你的节点版本,这是节点的问题link
,但要轻松解决您的问题,请按照以下步骤操作:
node -v
sudo npm cache clean -f
sudo npm i n -g
sudo n stable
node -v
再见;)