Angular CLI timeout - even though it's actually running fine #150

Closed
opened 2025-08-09 17:15:11 +00:00 by fergalmoran · 0 comments
Owner

Originally created by @mcaden on 2/27/2018

I'm using the latest Microsoft.DotNet.Web.Spa.ProjectTemplates 2.0.0 that was published 6 days ago.

I did the following:

  1. dotnet new --install Microsoft.DotNet.Web.Spa.ProjectTemplates
  2. dotnet new angular
  3. SET ASPNETCORE_Environment=Development
  4. dotnet run

So far so good. I receive in the log:

info: Microsoft.AspNetCore.DataProtection.KeyManagement.XmlKeyManager[0]
User profile is available. Using 'C:\Users{{user}}\AppData\Local\ASP.NET\DataProtection-Keys' as key repository and Windows DPAPI to encrypt keys at rest.
info: Microsoft.AspNetCore.SpaServices[0]
Starting @angular/cli on port 34100...
Hosting environment: Development
Content root path: C:\repos\ngpoc
Now listening on: http://localhost:5000
Application started. Press Ctrl+C to shut down.
info: Microsoft.AspNetCore.SpaServices[0]
> ngpoc@0.0.0 start C:\repos\ngpoc\ClientApp

ng serve --extract-css "--port" "34100"

** NG Live Development Server is listening on localhost:34100, open your browser on http://localhost:34100/ **

info: Microsoft.AspNetCore.SpaServices[0]
Date: 2018-02-27T21:14:41.782Z

info: Microsoft.AspNetCore.SpaServices[0]
Hash: 3c1a7b9355c0deb242a6
Time: 11790ms
chunk {inline} inline.bundle.js (inline) 3.85 kB [entry] [rendered]
chunk {main} main.bundle.js (main) 50.9 kB [initial] [rendered]
chunk {polyfills} polyfills.bundle.js (polyfills) 549 kB [initial] [rendered]
chunk {styles} styles.bundle.css (styles) 119 kB [initial] [rendered]
chunk {vendor} vendor.bundle.js (vendor) 9.5 MB [initial] [rendered]

info: Microsoft.AspNetCore.SpaServices[0]
webpack: Compiled successfully.

Ok, so I navigate to http://localhost:5000 and I receive this:

info: Microsoft.AspNetCore.Hosting.Internal.WebHost[1]
Request starting HTTP/1.1 GET http://localhost:5000/fetch-data
fail: Microsoft.AspNetCore.Diagnostics.DeveloperExceptionPageMiddleware[0]
An unhandled exception has occurred while executing the request
System.TimeoutException: The Angular CLI process did not start listening for requests within the timeout period of 50 seconds. Check the log output for error information.
at Microsoft.AspNetCore.SpaServices.Extensions.Util.TaskTimeoutExtensions.d__1`1.MoveNext()
--- End of stack trace from previous location where exception was thrown ---
at System.Runtime.ExceptionServices.ExceptionDispatchInfo.Throw()
at System.Runtime.CompilerServices.TaskAwaiter.HandleNonSuccessAndDebuggerNotification(Task task)
at Microsoft.AspNetCore.SpaServices.Extensions.Proxy.SpaProxy.d__4.MoveNext()
--- End of stack trace from previous location where exception was thrown ---
at System.Runtime.ExceptionServices.ExceptionDispatchInfo.Throw()
at System.Runtime.CompilerServices.TaskAwaiter.HandleNonSuccessAndDebuggerNotification(Task task)
at Microsoft.AspNetCore.Builder.SpaProxyingExtensions.<>c__DisplayClass2_0.<b__0>d.MoveNext()
--- End of stack trace from previous location where exception was thrown ---
at System.Runtime.ExceptionServices.ExceptionDispatchInfo.Throw()
at System.Runtime.CompilerServices.TaskAwaiter.HandleNonSuccessAndDebuggerNotification(Task task)
at Microsoft.AspNetCore.Builder.RouterMiddleware.d__4.MoveNext()
--- End of stack trace from previous location where exception was thrown ---
at System.Runtime.ExceptionServices.ExceptionDispatchInfo.Throw()
at System.Runtime.CompilerServices.TaskAwaiter.HandleNonSuccessAndDebuggerNotification(Task task)
at Microsoft.AspNetCore.Diagnostics.DeveloperExceptionPageMiddleware.d__7.MoveNext()
info: Microsoft.AspNetCore.Hosting.Internal.WebHost[2]
Request finished in 50161.8848ms 500 text/html; charset=utf-8
info: Microsoft.AspNetCore.Hosting.Internal.WebHost[1]
Request starting HTTP/1.1 GET http://localhost:5000/favicon.ico
info: Microsoft.AspNetCore.StaticFiles.StaticFileMiddleware[2]
Sending file. Request path: '/favicon.ico'. Physical path: 'C:\repos\ngpoc\wwwroot\favicon.ico'
info: Microsoft.AspNetCore.Hosting.Internal.WebHost[2]
Request finished in 8.5569ms 200 image/x-icon

I've seen the other post about changing the timeout and such, but the thing is it's not the timeout. I get the same error if I set the timeout to 600 seconds. It's like the cli just isn't seeing that angular is running. If I go to http://localhost:34100 like the original output states that ng serve is running on then everything works beautifully b/c it's already compiled and running - except of course the .net services b/c they are running on 5000.

It's simply as if the project isn't talking to the angular process.

If I run ng serve in a separate console and place spa.UseProxyToSpaDevelopmentServer("http://localhost:4200"); in Startup.cs the whole thing works fine.

*Originally created by @mcaden on 2/27/2018* I'm using the latest Microsoft.DotNet.Web.Spa.ProjectTemplates 2.0.0 that was published 6 days ago. I did the following: 1. `dotnet new --install Microsoft.DotNet.Web.Spa.ProjectTemplates` 2. `dotnet new angular` 3. `SET ASPNETCORE_Environment=Development` 4. `dotnet run` So far so good. I receive in the log: > info: Microsoft.AspNetCore.DataProtection.KeyManagement.XmlKeyManager[0] > User profile is available. Using 'C:\Users\{{user}}\AppData\Local\ASP.NET\DataProtection-Keys' as key repository and Windows DPAPI to encrypt keys at rest. > info: Microsoft.AspNetCore.SpaServices[0] > Starting @angular/cli on port 34100... > Hosting environment: Development > Content root path: C:\repos\ngpoc > Now listening on: http://localhost:5000 > Application started. Press Ctrl+C to shut down. > info: Microsoft.AspNetCore.SpaServices[0] > > ngpoc@0.0.0 start C:\repos\ngpoc\ClientApp > > ng serve --extract-css "--port" "34100" > > ** NG Live Development Server is listening on localhost:34100, open your browser on http://localhost:34100/ ** > > info: Microsoft.AspNetCore.SpaServices[0] > Date: 2018-02-27T21:14:41.782Z > > info: Microsoft.AspNetCore.SpaServices[0] > Hash: 3c1a7b9355c0deb242a6 > Time: 11790ms > chunk {inline} inline.bundle.js (inline) 3.85 kB [entry] [rendered] > chunk {main} main.bundle.js (main) 50.9 kB [initial] [rendered] > chunk {polyfills} polyfills.bundle.js (polyfills) 549 kB [initial] [rendered] > chunk {styles} styles.bundle.css (styles) 119 kB [initial] [rendered] > chunk {vendor} vendor.bundle.js (vendor) 9.5 MB [initial] [rendered] > > > info: Microsoft.AspNetCore.SpaServices[0] > webpack: Compiled successfully. Ok, so I navigate to http://localhost:5000 and I receive this: > info: Microsoft.AspNetCore.Hosting.Internal.WebHost[1] > Request starting HTTP/1.1 GET http://localhost:5000/fetch-data > fail: Microsoft.AspNetCore.Diagnostics.DeveloperExceptionPageMiddleware[0] > An unhandled exception has occurred while executing the request > System.TimeoutException: The Angular CLI process did not start listening for requests within the timeout period of 50 seconds. Check the log output for error information. > at Microsoft.AspNetCore.SpaServices.Extensions.Util.TaskTimeoutExtensions.<WithTimeout>d__1`1.MoveNext() > --- End of stack trace from previous location where exception was thrown --- > at System.Runtime.ExceptionServices.ExceptionDispatchInfo.Throw() > at System.Runtime.CompilerServices.TaskAwaiter.HandleNonSuccessAndDebuggerNotification(Task task) > at Microsoft.AspNetCore.SpaServices.Extensions.Proxy.SpaProxy.<PerformProxyRequest>d__4.MoveNext() > --- End of stack trace from previous location where exception was thrown --- > at System.Runtime.ExceptionServices.ExceptionDispatchInfo.Throw() > at System.Runtime.CompilerServices.TaskAwaiter.HandleNonSuccessAndDebuggerNotification(Task task) > at Microsoft.AspNetCore.Builder.SpaProxyingExtensions.<>c__DisplayClass2_0.<<UseProxyToSpaDevelopmentServer>b__0>d.MoveNext() > --- End of stack trace from previous location where exception was thrown --- > at System.Runtime.ExceptionServices.ExceptionDispatchInfo.Throw() > at System.Runtime.CompilerServices.TaskAwaiter.HandleNonSuccessAndDebuggerNotification(Task task) > at Microsoft.AspNetCore.Builder.RouterMiddleware.<Invoke>d__4.MoveNext() > --- End of stack trace from previous location where exception was thrown --- > at System.Runtime.ExceptionServices.ExceptionDispatchInfo.Throw() > at System.Runtime.CompilerServices.TaskAwaiter.HandleNonSuccessAndDebuggerNotification(Task task) > at Microsoft.AspNetCore.Diagnostics.DeveloperExceptionPageMiddleware.<Invoke>d__7.MoveNext() > info: Microsoft.AspNetCore.Hosting.Internal.WebHost[2] > Request finished in 50161.8848ms 500 text/html; charset=utf-8 > info: Microsoft.AspNetCore.Hosting.Internal.WebHost[1] > Request starting HTTP/1.1 GET http://localhost:5000/favicon.ico > info: Microsoft.AspNetCore.StaticFiles.StaticFileMiddleware[2] > Sending file. Request path: '/favicon.ico'. Physical path: 'C:\repos\ngpoc\wwwroot\favicon.ico' > info: Microsoft.AspNetCore.Hosting.Internal.WebHost[2] > Request finished in 8.5569ms 200 image/x-icon I've seen the other post about changing the timeout and such, but the thing is it's *not* the timeout. **I get the same error if I set the timeout to 600 seconds.** It's like the cli just isn't seeing that angular is running. If I go to http://localhost:34100 like the original output states that `ng serve` is running on then everything works beautifully b/c it's already compiled and running - except of course the .net services b/c they are running on 5000. It's simply as if the project isn't talking to the angular process. If I run `ng serve` in a separate console and place `spa.UseProxyToSpaDevelopmentServer("http://localhost:4200");` in `Startup.cs` the whole thing works fine.
Sign in to join this conversation.
1 Participants
Notifications
Due Date
No due date set.
Dependencies

No dependencies set.

Reference: github/JavaScriptServices#150
No description provided.