2
1

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?

More than 3 years have passed since last update.

コンテナ上で実行しているAngularアプリのホットリロードを有効にする

Posted at

#概要
私の以前の記事でAngularアプリをコンテナ上で実行できるような環境を整えたのですが、アプリのファイルを編集してもホットリロードが効かないので、変更を確認するには再ビルドする必要があるのが難点でした。
少し調べてみたら、コマンドのオプションを追加するだけで有効にできたので、共有も含めて記事にしたいと思います。

#環境

  • Windows10 pro (Homeでも可)
  • Visual Studio Code
  • Docker version 20.10.8
  • Docker Compose version v2.0.0

以下、Visual Studio Codeの拡張機能

  • Docker v1.17.0
  • Remote - Containers v0.202.5

#ビルド
以下のように"ng serve"のオプションに"--poll 1"を付けるだけで編集が反映されるようになりました。
あとはこのコマンドをpackage.jsonに記述するなり、docker-compose.ymlファイルに記述するなり、お好きにどうぞ。

bash
$ ng serve --host 0.0.0.0 --poll 1

#まとめ
公式ドキュメントを確認してみると、pollオプションは検知時間の設定項目のようでした。つまり、検知時間が即時だとコンテナ上で実行している場合は検知されないようです。
あまり詳しく調べた訳ではないので補足等がありましたら、コメントいただけると嬉しいです。記事も修正します。

これでコンテナ上で快適な開発環境を手に入れることができました。

#参考

2
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
2
1

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?