web-dev-qa-db-ja.com

Vue無効なホストヘッダー

2日前に私のプロジェクト（vue createで作成）が機能しなくなった理由がわかりません-in Chrome i get

無効なホストヘッダー

そして

WDSが切断されました

エラー。 cmdではすべてが正しくコンパイルされます（npm runserve）webpackがわからないので、修正方法がわかりません。

私がすでにしたこと：

  • 再インストールされたノード
  • すべてのnpmパッケージを削除して再インストールしました
webpackwebpack-dev-servervue-cli-3
7
user10826938

同じ「無効なホストヘッダー」の問題を検索しているこの質問が見つかりました。これが私がそれを解決した方法です。

リモートサーバーのDockerでVue dev servernpm run serveを実行しています。上記のエラーメッセージが表示されたhttp://example.com:8080でアクセスできませんでした。

正しく安全な方法は、ドメイン名をvue.config.jsファイルに追加することです。

"devServer": {
  "public": "example.com"
}

これは新しいvueプロジェクトがVue Cliコマンドで開始されました：vue create myprojectを介してVuetifyが追加されたvue add vuetifyです。その後の私のvue.config.jsの全内容は次のとおりです。

module.exports = {
  "transpileDependencies": [
    "vuetify"
  ],
  "devServer": {
    "public": "example.com"
  }
}
0
Serge