Dokcer 環境で、vue init したプロジェクトで npm run dev したときにウェブブラウザから確認するときにできず、ハマった問題を解決した方法

スポンサードリンク


解決方法

  • host を localhost から 0.0.0.0 へと修正する。

config/index.js

     proxyTable: {},
 
     // Various Dev Server settings
-    host: 'localhost', // can be overwritten by process.env.HOST
+    host: '0.0.0.0', // can be overwritten by process.env.HOST
     port: 8080, // can be overwritten by process.env.PORT, if port is in use, a free one will be determined
     autoOpenBrowser: false,
     errorOverlay: true,

0.0.0.0 とは?

一般的な 0.0.0.0 および、 Docker での 0.0.0.0 の両方を把握できれば良さそうです。

ですがしかし、よくわかりませんでした><。参考ページのみ掲載しておきます。

おわりに

今回、『Vue.js 入門』 8.4.4 アプリケーションの起動確認、にてウェブブラウザからアクセスできない><、という状況に陥りましたのが発端です。

vue init ではなく、 vue create でプロジェクトを作成した場合は、 Docker の環境でもウェブブラウザからアクセスできました。

したがって、環境の問題ではなく、プロジェクトの問題であると早めに問題を絞り込むことができました♪

問題解決にあたっては、次のページが参考になりました♪ありがとうございます!

以上です。

コメントを残す