4

I noticed the following behaviour in Visual Studio 2022 (version 17.0.0) with a .Net 6.0 Blazor project:

  1. Create a new Blazor WebAssembly project and DO NOT select the 'ASP.NET Core hosted' option.
  2. Run the application without debugging.
  3. Ensure Hot Reload is enabled
  4. Make a change to the CSS. You will notice the browser instantly displays the change without needing a refresh / reload.

Repeat the steps above but this time during step 1 select the 'ASP.NET Core hosted' option. Now the CSS hot reload functionality is not working, even though making a change to the razor page itself does still hot reload (such adding or changing a HTML element).

According to the documentation*, hot reload is supported by WebAssembly when running without a debugger. I can't understand why only the CSS hot reload does not work if the 'ASP.NET Core hosted' option is chosen. The CSS and server appear to be unrelated.

*https://devblogs.microsoft.com/dotnet/update-on-net-hot-reload-progress-and-visual-studio-2022-highlights/

Improve this question
3
  • I have the same problem, I have a webassembly hosted app and hot reload doesnt work. Changes without debugging are applied by reloading the browser. Weird, there is a demo video from microsoft on a webassembly hosted project where the hot reload is working. i think we are missing a pice of a setting or implementation somewhere in our code: youtube.com/… Commented Nov 21, 2021 at 14:29
  • For anyone else who lands here due to CSS hot reload issues when using Razor pages, just remember that Hot Reload works with CSS files in the wwwroot directory. In my case I thought it was broken because my CSS files are in other directories and only copied to wwwroot during a normal Visual Studio build, so Hot Reload was NOT picking up my changes. To fix it, I now edit the CSS file in wwwroot while the app is running then copy the changes back to the original file location elsewhere in the project when happy. Commented Apr 25, 2022 at 18:10
  • In MVC 5 I had problem with hot reload too... It is working, but... If file is larger (lets say over 1000 lines - than hot reload stops working. Commented Aug 1, 2022 at 12:33

2 Answers 2

Reset to default
2

Ok, so this is what I did in order for an existing project (web assembly hosted version) to work with .net hot reload WITHOUT DEBUGGING:

  1. Install Visual Studio 2022.
  2. Download and install latest version of sdk and runtime. You could already have them but just to be safe: SDK and Runtime
  3. Make sure your solution is targeting .NET 6 or update the existing solution to .net 6. Follow the steps provided here: Update to .NET 6 from .NET 5
  4. Go to Tools -> Options and check everything that is connected to hot reload including the CSS Hot Reload box like this:

.NET HOT RELOAD SETTINGS

  1. Delete .bin and .debug folders from your solution, restart your PC and rebuild the solution after restart.
Improve this answer
Sign up to request clarification or add additional context in comments.

2 Comments

I've have the same issue with server version. I'm using dotnet watch and hot reload says successful but isn't I hit ctrl-R for refresh and all good.
I agree with @ShaunRoach, we upgraded a project from .Net 5 and the HR works but only with a page refresh. I tested in a new app and it works without needing page refresh. I then compared the projects, and nothing stood out as missing from upgrade. Ugh.
0

I was facing this problem while working with blazor server projects with .net 7 and this solution was very usefull for me and solved the problem for hot reloading on updating css files on blazor server projects. Even you don't need to do refersh for your page. https://www.nuget.org/packages/Toolbelt.AspNetCore.CssLiveReloader/1.1.4?_src=template

I hope this is useful for you.

Improve this answer

Comments

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.