Webpack 4热点重播:无效主机/源头

Question

我正在和webpack开发服务器一起做热重装。然而，在我的控制台中，它一直在说Invalid Host/Origin header

我在webpack配置中的设置如下：

'use strict'

const webpack = require('webpack')
const { VueLoaderPlugin } = require('vue-loader')
const HtmlWebpackPlugin = require('html-webpack-plugin')

module.exports = {
  mode: 'development',

  devServer: {
    headers: {
      'Access-Control-Allow-Origin': '*'
    },
    hot: true,
    watchOptions: {
      poll: true
    }
  },
  module: {
    rules: [
      ...
    ]
  },
  plugins: [
    new webpack.HotModuleReplacementPlugin(),
    ...
  ]
}

如何解决这个问题，以便它在我的开发环境中工作？会喜欢听到这一点，因为目前我必须不断刷新页面。

Answer 1

最后，这是一个更新的软件包，没有得到正确的通过，并解决后，安装最新的版本。

Answer 2

这个问题可能是由最近修复的webpack开发服务器问题引起的。

为了避免获取Invalid Host/Origin header错误，请将以下内容添加到devServer条目中：

disableHostCheck: true

Answer 3

设置allowedHosts，https://webpack.js.org/configuration/dev-server/#devserverallowedhosts。例如，如果您的网页是xyz.google.com，那么只需向其添加一个主机.google.com即可。