Blazor,  Microsoft

Blazor with dotnet watch run in the Pre-Dotnet 6 and VS 2022 days

Oh, how we do wait for the release of dotnet 6 and most important VS 2022. Why? Well the promise of hot-reload without hoops to jump through.

For the most part in VS 2019 16.10.4, “hot-reload” of a Blazor app is not too bad <= Circle that “not too bad”- it does actually work… mostly! Yes, I do refer to the “dotnet watch run”. It does detect changes in your Blazor files and reload the browser page… yeah, BUT it does have issues. Here comes the list….

It doesn’t detect new files added… go ahead add a new razor page while your project is in “dotnet watch run” – nope it will not find it no matter how many times you hard refresh the browser. Not only razor pages, but new stylesheets- yeap, it’s not going to find those either!

It has issues when you make too many complicated changes in your code. Yes compile errors that don’t go away.

It interferes with an already “flaky” intellicode/intellisense… My goodness talking about annoying! Already half the time, bootstrap intellisense stops working on razor pages. And what the hell happened to code snippets? (Probably less about hot-reload than this version of VS being riddled with bugs!)

Ok, I’m mostly over that now…. deep breath… 1…2…3…4… Alright.

Let’s get to the point, the matter of always having to type in that “dotnet watch run”, stop it, and type it in again… what’s the point? Let’s create a launch profile so that we can tack this into VS (gee you think the Blazor Template should already have that? Yeap it should). Here we go:

 

"Watch": {
      "commandName": "Executable",
      "launchBrowser": true,
      "launchUrl": "http://localhost:5000/",
      "commandLineArgs": "watch run",
      "workingDirectory": "$(ProjectDir)",
      "executablePath": "dotnet.exe",
      "environmentVariables": {
        "ASPNETCORE_ENVIRONMENT": "Development"
      }
    }

In your launchSettings.Json file, place the code above in the “Profile” section…. Match sure this is in the “PROFILE” section!

Now let the magic begin… well mostly… When you tap the “Watch” on the Build/Debug drop down… that lovely “dotnet watch run” will execute in a window… and now you to can experience the “buggy” hot-reload of a Blazor app. 😎
~SG

Leave a Reply