Posted at

webpackを利用した開発環境にLAN経由でアクセスすると何も表示されない問題を解消する

More than 1 year has passed since last update.

webpackを利用した環境ではwebpack-dev-serverrails serverを走らせる形になりますが、例えばモバイルの実機からデザインなどを確認したい場合 http://192.168.0.13:3000 みたいな感じで、LAN内部で他の端末から開発環境にアクセスしたいケースがあるかと思います。

その場合、webpackの読み込みがされず、白紙のページが表示されてしまいます。

この問題はwebpack-dev-serverの起動時に、開発環境のipアドレスを指定することで解消します。

$ bin/webpack-dev-server --host 192.168.0.13

そもそもrailsに繋がらない場合は

$ bin/rails server -b 0.0.0.0

とすれば大丈夫です。