vue-cliのwebpack-dev-serveをプライベートIPアドレスで起動する

個人開発したアプリの宣伝
目的地が設定できる手帳のような使い心地のTODOアプリを公開しています。
Todo with Location

Todo with Location

  • Yoshiko Ichikawa
  • Productivity
  • Free

スポンサードリンク

経緯

LAN内のスマートフォンなどの他の端末から開発中アプリに接続し、確認したかった。

デフォルトでの起動はlocalhostとなるので、例えば開発中PCのIPアドレスが192.168.0.1だったとして、http://192.168.0.1:8080としても起動しているサーバ名がlocalhostなので接続できない。


設定

/config/index.js でホスト名を指定できる。これを開発PCのIPアドレスに変更すれば良い。

- host: 'localhost', // can be overwritten by process.env.HOST
+ host: '192.168.0.1',

npm run devで再起動すれば、LANの他PCからhttp://192.168.0.1:8080とすることで接続できる。