【Webpack错误】解决Webpack-dev-server控制台输出invalid host header Disconnect...

扶牛小孩

具体的错误详情如下图所示，使用npm跑起来自己的前端项目之后，打开控制台之后就会直接输出下面的错误信息。

基本上就是不间断的输出下面的错误信息：

[JavaScript] 纯文本查看 复制代码

client:168 Invalid Host/Origin header
error @ client:168
client:171 [WDS] Disconnected!

最终的解决方案如下：
进入你自己的WEBpack配置文件，也就是webpack.config.js这个文件
修改你的配置文件信息如下即可：

[JavaScript] 纯文本查看 复制代码

devServer: {
        port : 8083,
        host : "127.0.0.1",
        contentBase: './dist',                      // 服务器启动的根目录
        historyApiFallback: {
            index : '/dist/index.html'              // 404 或者其他页面就会自动跳转到当前位置
        },
disableHostCheck: true
    }

关键一行代码就是：disableHostCheck: true
以上就是本次解决这个坑的经验分享，希望对大家有帮助！
至此，上面的问题解决！

MelissaFon

很有帮助