LoginSignup
1
1

More than 5 years have passed since last update.

cloud9でvue.jsプロジェクトをrunしたらエラーになった話

Last updated at Posted at 2019-02-23

技術書をせっせこやっていこう

どうにも買って満足してしまうのですが、技術書は買っても手を動かさないとスキルにならない。
積んでる本を消化していかんとね、とぽちぽちやり始めた。

やってる技術書

  • Vue.jsとFirebaseで作るミニWebサービス

環境

  • cloud9
  • Node.js v8.11.2
  • Vue.js 2.9.6

エラーって?

npm run devしたら「Invalid Host header」が出た。
プロジェクトを作り直しても変わらずで、5分くらい詰んだ。

スクリーンショット 2019-02-23 23.17.14.png

解決方法

ググったら速攻で出て来た。
次からは3分悩んでダメだったら検索することにしよう。

 (前略)
  :
  devServer: {
    historyApiFallback: true,
    noInfo: true,
    overlay: true
  },
  :
 (以下略)

これ(↑)をこんな感じ(↓)に「disableHostCheck:true」を追加する。
追加する際は直前のオプションの最後尾にカンマを入れ忘れないように注意。

 (前略)
  :
  devServer: {
    historyApiFallback: true,
    noInfo: true,
    overlay: true,
    disableHostCheck: true
  },
  :
 (以下略)

するとこーなる。

スクリーンショット 2019-02-23 23.17.35.png

やったぜ!

参考資料

webpack-dev-serverで起動したアプリが「Invalid Host header」と表示される場合の対処法

1
1
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
1
1