how to keep the AngularCLIServer running between builds on asp.net core with Angular 7

Question

I am using ASPNetCore and Angular 7. My Angular app is getting quite big, so re-compiling both the C# code and the angular code every time I run is getting cumbersome.

I have this line in my Startup.cs file.

  if (env.IsDevelopment()) {
     spa.UseAngularCliServer(npmScript: "start");
  }

Is it possible to A. either keep this running when I terminate the ASPNet application, or B, run it separately and still route requests through the same SSL port that the aspnet app is using?

Since angular has hot module replacement, I want to just keep that running 99% of the time and just re-compile my backend when I make changes to C# code.

Answer 1

From the documentation

Run "ng serve" independently The project is configured to start its own instance of the Angular CLI server in the background when the ASP.NET Core app starts in development mode. This is convenient because you don't have to run a separate server manually.

There's a drawback to this default setup. Each time you modify your C# code and your ASP.NET Core app needs to restart, the Angular CLI server restarts. Around 10 seconds is required to start back up. If you're making frequent C# code edits and don't want to wait for Angular CLI to restart, run the Angular CLI server externally, independently of the ASP.NET Core process. To do so:

In a command prompt, switch to the ClientApp subdirectory, and launch the Angular CLI development server:

cd ClientApp
npm start

Important

Use npm start to launch the Angular CLI development server, not ng serve, so that the configuration in package.json is respected. To pass additional parameters to the Angular CLI server, add them to the relevant scripts line in your package.json file.

Modify your ASP.NET Core app to use the external Angular CLI instance instead of launching one of its own. In your Startup class, replace the spa.UseAngularCliServer invocation with the following:

C#

spa.UseProxyToSpaDevelopmentServer("http://localhost:4200");

When you start your ASP.NET Core app, it won't launch an Angular CLI server. The instance you started manually is used instead. This enables it to start and restart faster. It's no longer waiting for Angular CLI to rebuild your client app each time.