zukucode
主にWEB関連の情報を技術メモとして発信しています。
ASP.NET

ASP.NET Core dotnet watch runでソースコードを保存時に自動で反映する

ASP.NET Core + Reactのプロジェクトを作成するで、dotnet runコマンドでプロジェクトを実行する方法を紹介しました。

dotnet runだと、ソースコードを修正するたびに、プログラムを実行しなおす必要があるため、手間がかかります。

ASP.NET Coreにはdotnet watch runという便利な機能があります。

dotnet watch runは、dotnet runと同様にプロジェクトを実行するコマンドですが、ソースコードを修正して保存したタイミングで、プログラムを実行しなおすことなく、修正箇所を反映することができます。（Hot reloadと呼びます）

修正内容によっては、プログラムを再起動する必要がありますが、再起動も自動で行ってくれます。

動作確認

dotnet runの代わりに、dotnet watch runでプロジェクトを実行します。

試しに、「Controllers\WeatherForecastController.cs」のファイルを修正します。

現在はデータを５件レスポンスしていますが、１０件レスポンスするように修正します。

WeatherForecastController.cs
    [HttpGet]
    public IEnumerable<WeatherForecast> Get()
    {
        return Enumerable.Range(1, 5).Select(index => new WeatherForecast
        return Enumerable.Range(1, 10).Select(index => new WeatherForecast
        {
            Date = DateTime.Now.AddDays(index),
            TemperatureC = Random.Shared.Next(-20, 55),
            Summary = Summaries[Random.Shared.Next(Summaries.Length)]
        })
        .ToArray();
    }

ファイルを保存すると、コンソールに以下のようなメッセージが出力されます。

dotnet watch ⌚ File changed: ./Controllers/WeatherForecastController.cs.
dotnet watch 🔥 Hot reload of changes succeeded.

ブラウザでFeatch Dataのページを表示すると、データが５件ではなく１０件表示されていることが確認できます。

プログラムが再起動するパターン

プログラムの修正内容によってはhot reloadが行えず、プログラムが再起動する場合があります。

以下のように、Getファンクションにasyncを追加して、非同期ファンクションに修正します。

WeatherForecastController.cs
    [HttpGet]
    public IEnumerable<WeatherForecast> Get()
    public async Task<IEnumerable<WeatherForecast>> Get()
    {
        return Enumerable.Range(1, 10).Select(index => new WeatherForecast
        {
            Date = DateTime.Now.AddDays(index),
            TemperatureC = Random.Shared.Next(-20, 55),
            Summary = Summaries[Random.Shared.Next(Summaries.Length)]
        })
        .ToArray();
    }

ファイルを保存すると、以下のようにhot reloadが行えないため、プログラムを再起動するかどうかの確認メッセージが表示されます。

dotnet watch ⌚ File changed: ./Controllers/WeatherForecastController.cs.
dotnet watch ⌚ Unable to apply hot reload because of a rude edit.
  ❔ Do you want to restart your app - Yes (y) / No (n) / Always (a) / Never (v)?

yを入力すると、プログラムが再起動します。

aを入力すると、次回以降、この確認メッセージが表示されず、自動でプログラムが再起動するようになります。

課題

ASP.NET Core + Reactの構成だと、プログラムが再起動時に、Reactのプロジェクトも再起動してしまいます。

最初は気にならないかもしれませんが、規模が大きくなるにつれて、Reactの起動時間が長くなり、待ち時間が発生してしまいます。

プログラムが再起動時にReactのプロジェクトを再起動させない方法をASP.NET Core + React dotnet watchの再起動時にReactのプロジェクトを再起動させない方法で紹介しています。

ASP.NET

関連記事