dotnet core（Web API）コードの変更とTypeScriptコードの変更のライブリロードを有効にする方法

Question

クライアントコードをAngular 2（Typescript）でWeb API開発のためのAsp.Netコアアプリケーションを使用しています。

ビルドの目的で、私はWebPackを一緒に使用していますが、私も "webpack-dev-server"を使用しています。

現在、私は、私は、コマンド "startWebpackDevServer実行NPM" を実行すると、Webアプリケーションは、「ポートで利用可能である2つの "Package.Json" ファイル内のスクリプト、

"scripts": { 
"startWebpackDevServer": "webpack-dev-server --inline --progress --port 8080", 
"build": "SET NODE_ENV=development && webpack -d --color && dotnet run" 

}、

1. を持っています8080 "となり、クライアントサイドコード（typescript + angular）を変更すると、ライブリロードが発生し、ブラウザに変更が自動的に表示されます。 （すばらしいです）。

2. しかし、ポート8080では、私のWeb APIコールで404が表示されました。なぜですか？

3. "npm run build"コマンドを実行すると、Webアプリケーションがポート "5000"で使用可能になり、Web API呼び出しでも結果が得られます。欠落しているものは "live reload"です。

私はtypescriptです+角度コード& B.で A.変更のWeb APIの変更（C＃）コード、どちらかのリロード生きるべきコマンドを探しています。

お勧めします！

Answer 1

私はあなたの質問を得ているとは確信していませんが、Web APIのリロードを実行するコマンドを持つことはできません。どのような方法でもまずノードには関係しません。あなたはwatchコマンドや.Net Coreに似た何かを使ってみることができます。

here時計の使用方法を確認できます。それ以外の場合は、Visual Studioでアプリケーションをビルドし、IIS（またはIIS Express）の背後で実行すると、これはほぼ同じことになります。

Answer 2

私はあなたの必要性を完全に理解していませんが、まだ答えがあります。

http-serverとwatchでこれを行うことができます。 javascriptプロジェクト（Web）またはC＃プロジェクト（API）のいずれかが変更されたときにライブリロードを行うには、ウェブとWeb APIプロジェクトを同じフォルダの下に置くことをお勧めします。

あなたはWebPACKの中に時計を無効にして、あなたは外部ツールを持ってしようとしているのでWebPACKのdevのサーバーを使用しないように持っている（見&のhttpサーバ）ページを提供/ファイルの変更を監視し、リロードします。

http-serverおよびwatch npmモジュールを次のようにグローバルにインストールします。

> npm install -g http-server watch

watchファイル上の現在の作業ディレクトリ内のファイルの変更を監視します。 javasriptコードまたはc＃コードのいずれかに変更があった場合、CLIオプションとして与えられたコマンドが実行されます。コマンドはhttp-serverを使用してページをリロードします。

package.jsonのビルドタスクは、次のようになっている可能性があります。

"build:dev": "SET NODE_ENV=development && dotnet run && webpack -d --color && npm run serve", 
"watch": "watch 'npm run build:dev' -p=node_modules|Bin|Obj|lib -d", 
"serve": "http-server -p 8080", 
"start": "npm run build:dev && npm run watch" 

さて、構築に役立つとウェブとAPIを監視する> npm startを実行します。

Answer 3

"dotnet watch run"はwebapi live-reloadを実行する必要があります。タグをMicrosoft.DotNet.Watcher.Toolsのプロジェクトファイルに追加する必要があります。