JetBrains Rider error on new Angular SPA template

ServiceStack
1

Just wanted to do a quick sanity check. I’m looking to upgrade my projects to NET 10.0 and the latest ServiceStack version.

I decided to take a look at the current Angular SPA template to see how it all fits together. I’ve created a new project and ran it inside JetBrains Rider.

On startup I’m getting a breakpoint in BreakForUserUnhandledException, also an error showing Exetrnal Sources: Unable to download sources: 0, NotFound (404) - I can disable the option “Enable private Source Link support” to stop the download error, however I still get the exception [HttpRequestException: An error occurred while sending the request.]

Is this normal behaviour and I should just ignore and carry on, or is something not right?

2

Just tried downloading, restoring and running a new Angular SPA project which ran without issues:

image
image1613×2115 175 KB

The Exception sounds like it’s unable to download the debug sources, this would help when debugging down into the framework to debug the original framework sources. It shouldn’t be needed for running your App.

3

Strange. The exception still occurs when I disable the private source link support. Could I ask what exception settings you have in Rider in case it’s something within the IDE that’s misconfigured..

4

I’m possibly running it wrong in debug. I’m using the ‘Acme: https’ configuration, I can see from your screenshot that you’re using the Acme.Client: run config. I tried using this default but can’t get it to run the backend.

I’ve rechecked the documents but I feel I’m definitely missing something.

5

Still using the defaults, I can run the project fine but I now see the error when trying to debug it.

I’m seeing a popup, asking for an Authentication token:

image
image782×212 40.8 KB

It might be a temporary server or network issue, so I’ll investigate tomorrow to see if the error still occurs.

6

When I try and debug (F5) with the default project it asks for the script to run? (Error: No ‘start:default’ npm script)

Are you seeing the unhandled exception at all as well as that external sources popup?

7

You should be running the .NET Host Project (i.e. MyApp not MyApp.Client).

I’ve fixed a Vite HMR Dev Proxy WebSocket issue in the latest version of NodeProxy which was throwing a HTTP Exception that Rider’s debugger was breaking on, in the latest v10.0.5 release on pre-release packages.

I’ve added a angular-spa/NuGet.Config so new projects use the pre-release packages with the fix.

You can get it by adding the NuGet.Config to your solution folder, which you can also do add with your preferred tool:

# dotnet tool
x mix myget

# npm tool
npx add-in myget

If you already had v10.0.5 installed you’ll also need to clear your NuGet packages cache:

 dotnet nuget locals all --clear

If your App_Data/app.db hasn’t been created, you’ll need to run the DB Migrations to create the App Database.

npm run migrate
8

Tried again from scratch with the new version and myget implemented. There’s a license issue with the template (states it expired 01/01/2026), I fixed that and tried to debug using the “Acme: https” run configuration.

Still get the exception unfortunately and the 404 error.

9

Just had a moment to do a bit more investigating. Looks like it’s a connection refused to localhost:4200 exception that’s happening. I’m assuming this is because a connection is made before the Angular backend is up and running?

I can just move past the initial exception and the solution runs fine, is there any way to prevent/ignore this error?

Thanks for all your help.

10

It’s what the NodeProxy does, it returns an error that the UI check for until it can establish a connection to the node server. If you run your project, you should see a loading screen whilst it retries to connect until its ready.

Rider docs has info on how to ignore specific exceptions.

You could probably also add a Thread.Sleep() before app.Run() to give the node server some time to startup, before launching the .NET UI which makes the first HTTP Request.