How to automatically reload .NET Core project in Visual Studio 2019

Question

I tried to automatically reload ASP.NET Core project as I do using Angular with Node or NPM.

When I change the code of the .NET Core project and save, I want the web page to be automatically refreshed in the web browser.

Ferroconcrete

I'm not exactly sure what do you mean by reload but in general you can't change the code in runtime. – Sparing

@YasserJarouf, I am not talking about In the visual studio 2019. – Ferroconcrete

ASP.NET Core Angular projects already reload the client-side code - they are Angular, not just same as Angular. ASP.NET Core is used to provide the APIs and non-SPA pages. – Tracheotomy

Any another ways, Like combine install npm package with ASP.NET Core project ? – Ferroconcrete

I want to add a link Live Reloading Server And Client Side ASP.NET Core Apps with BrowserSync that might help future Googlers. – Janitor

Answer 1

run this command in project console

dotnet watch run

same works for visual studio code

From Develop ASP.NET Core apps using a file watcher (for 3.0)

dotnet watch is a tool that runs a .NET Core CLI command when source files change. For example, a file change can trigger compilation, test execution, or deployment.

The link above contains a tutorial with two sample projects:

1. WebApp (an ASP.NET Core web API) and
2. WebAppTests (unit tests for the web API).

Alternatively, you can also this nuget package for runtime compilation.

Sorkin

Answer 2

I think that dotnet watch should work. Please see the documentation from the link as there are various options.

1. Add Microsoft.DotNet.Watcher.Tools to the tools section of the project.json file.
2. Run dotnet restore.
3. Execute with dotnet watch run.

Erb

But Using this, I am not able to reloading automatically like Angular. If I pressed ctrl+s, That time not any action working in browser. Thanks for giving answer. – Ferroconcrete

you have to run your application using command prompt and add watch details in project. json – Erb

Or you can just use my launch profile I provided in my answer.. – Duyne

You can see changes in console.. when you try to run.. are you able to see anything? – Erb

Yes, But not reloading automatically in the browser like Angular. – Ferroconcrete

@AkashLimbani like Angular doesn't do what you think it does. If you create use the Angular ASP.NET Core template, changes to the client code will be reloaded automatically. This is done because Node does the equivalent of dotnet watch and reloads the SPA when the files change. – Tracheotomy

Answer 3

You can use dotnet watch. Viz. Docs

I have created custom lunch profile to make it easyer to run in VS.

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

Duyne

Using this, Not reloading automatically in the browser like Angular. – Ferroconcrete

Can you run Angular project ? – Ferroconcrete

Doesn't work for me on .NET Core 5 too. I needed to add "commandName": "Project" cause otherwise VS won't use it, but no reaction on file changes. When I run dotnet watch run outside of VS, it works well but sadly without any debugger :/ – Acrimonious

I got the debugger started with "commandName": "Executable", and "executablePath": "dotnet.exe" but the debugger seems not properly attached: It doesn't hit breakpoints, which works fine with the default <ProjectName> project. – Acrimonious

Answer 4

According to this requirement, we need to run .net core application just like Angular application, loading the pages and contents automatically without built and manual refresh.

I had done some research and experienced that auto-reloading is not possible in ASP.NET core project. However, we have got the success, in our solution we are using dotnet watch which monitors source files and if a file changes, shuts down the application that it started, rebuilds and publishes the project, and then restarts the application then we just need to refresh page manually in the browser to get the changes which made in application, we don’t require to build or start the project.

Steps to follow to use asp.net watch:

1) Create.Net core application.

2) Open a command Window in your Web project's folder

3) Type dotnet watch run

4) Open your browser and navigate to an API or Page

5) Make a change to source code

6) Save the file

7) Go back to the browser and refresh manually

8) You should see the change reflected

Impropriate

How to do in Visual Studio 2019 ? – Ferroconcrete

Can confirm this works in Visual Studio Code with ASP.NET MVC. – Consumption

Answer 5

Use dotnet watch to recompile the source code. Use Browser Link with "Browser reload on save" from Visual Studio to reload all your browsers. https://marketplace.visualstudio.com/items?itemName=MadsKristensen.BrowserReloadonSave

Ingvar

Answer 6

One of the tasks automatically created in VS Code environment for a ASP.NET Core project (web, mvc, etc.) is called "watch". To check this, from ".vscode" folder, open the file tasks.json and you will see 3 tasks configuration: "build", "publish" and "watch". By default, "build" is used in launch.json. You can then go in the "configurations" section of launch.json and look for "preLaunchTask", and there, you can change the task to "watch". And that's it. Hot reload will be active when you run your web application. Regards.

Lexielexigraphy

Answer 7

You should think triple before going forward to this option. (1) It is a resource-consuming. As it necessitates auto-build, as pre-operation, of the modified project and sometimes the whole solution. (Imagine a medium to a huge Asp.net solution composed from many projects, get built for each modification performed !! how much time is left for programming ???!!) (2), as you know, the page reload consumes much time for the first launch after a successful build !!... Hence, the time you want to gain from this option you will be wasted multiple, especially CLR-based programming languages (e.g. .NET Core). And finally, (3) your project is expected to be in need to develop test samples that can be injected automatically in the view for a better automation process, imagine how difficult it is!

Instead, try to unit test your solution, and then, any next modification is expected to be superficial and low occurring.

If you disagree with my proposition, I suggest developing a visual-studio extension that better reload the target web page on-build rather than an on-save-changes event. Next, Ctrl + b will do the job!

Where to start?

I have developed a VSIX that watches folders to load automatically specific generated files outside the VS UI. check the source code you will have an idea about the project's files management. it revolves in the EnvDTE API, please have a look in this piece of code.

Also, check the source project from here

Whisler

Answer 8

Follow the procedure indicated in the Microsoft's page.

1. Nuget package Microsoft. VisualStudio. Web. BrowserLink

2. Install NuGet Microsoft.AspNetCore.Mvc.Razor.RuntimeCompilation

3. app.UseBrowserLink(); in the startup.cs page on the configure method.

4. and enter image description here

now when you change something on your code Ctrl + Maj + enter and everything is saved and actualized on your browser.

Appalling