Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Enable auto recompile of a Razor Class Library during development #16703

Closed
FanrayMedia opened this issue Oct 31, 2019 · 10 comments
Closed

Enable auto recompile of a Razor Class Library during development #16703

FanrayMedia opened this issue Oct 31, 2019 · 10 comments

Comments

@FanrayMedia
Copy link

@FanrayMedia FanrayMedia commented Oct 31, 2019

Is your feature request related to a problem? Please describe.

One of my pain point developing Asp.net Core apps is that the changes to the views inside a Razor Class Library is not automatically picked up. Here are the steps to produce my issue.

  1. Use VS2019 and create one WebApp
  2. Create a Razor Class Library with a Razor Page, say Page1.cshtml
  3. Reference the RCL in the WebApp
  4. Ctrl + F5 to launch the WebApp
  5. Make a change to Page1.cshtml inside the RCL
  6. Refresh the WebApp in your browser, and you will not see the change

Describe the solution you'd like

Any changes made to a referenced Razor Class Libraries should automatically make the hosting WebApp recompile and let the developer see the change, instead of the developer having to make a change inside the hosting WebApp for the RCL change to be picked up. I can't imagine a RCL author having to recompile the proj himself on every change he/she makes in the RCL to see it in the browser.

Additional context

I recorded a YouTube video to demo this https://youtu.be/Kyn-6Bt1WF8
Demo repo https://github.com/FanrayMedia/UnboxingNetCore3

@Pilchie Pilchie added the area-mvc label Oct 31, 2019
@FanrayMedia FanrayMedia changed the title [Question] - How to auto recompile a Razor Class Library? Enable auto recompile of a Razor Class Library during development Oct 31, 2019
@javiercn

This comment has been minimized.

Copy link
Member

@javiercn javiercn commented Nov 1, 2019

@FanrayMedia thanks for contacting us.

We'll evaluate your feature request and come back to you.

@pranavkm Is that something that enabling Runtime compilation would fix?

@soeleman

This comment has been minimized.

Copy link

@soeleman soeleman commented Nov 1, 2019

@FanrayMedia you can try using dotnet-watch.
From your sample; change the WebAppRazor.csproj
WebAppRazor csproj
and for easier run dotnet-watch add launchSettings json
launchSettings json

Alternative is using other watcher like BrowserSync or Westwind.AspnetCore.LiveReload from @RickStrahl

@pranavkm

This comment has been minimized.

Copy link
Member

@pranavkm pranavkm commented Nov 1, 2019

@soeleman sounds like a pretty reasonable solution. The fix for VS issue is being tracked as part of this - dotnet/project-system#3163 and it applies to rebuilding the project when VS notices changes to cs, cshtml or razor files in the referenced class library.

If you specifically care about cshtml files, an alternative to @soeleman's suggestion might be to involve runtime compilation in the dev inner loop. The sample here demonstrates setting it up to perform runtime view compilation in the main app as well as the class library specifically in Debug builds - https://github.com/aspnet/samples/blob/master/samples/aspnetcore/mvc/runtimecompilation/MyApp/Startup.cs#L32-L41.

@javiercn

This comment has been minimized.

Copy link
Member

@javiercn javiercn commented Nov 1, 2019

Closing this issue as a duplicate of dotnet/project-system#3163 which will be the one tracking the only changes needed and an alternative option has been provided.

@javiercn javiercn closed this Nov 1, 2019
@FanrayMedia

This comment has been minimized.

Copy link
Author

@FanrayMedia FanrayMedia commented Nov 1, 2019

@javiercn @soeleman @pranavkm thank you all for your input! Razor Class Library with Razor Page worked. However, now I have the same issue with a Razor Class Library that has Razor Component. My repo code https://github.com/FanrayMedia/UnboxingNetCore3/blob/master/WebAppRazor/Startup.cs#L42-L58

Here I'm mimicking the sample and adding both Razor Class Libraries in my Startup.cs, one with Razor Page and the other the Razor Component. The one with Razor Page works, but changes to Razor Component is not able to be picked up.

#if DEBUG
            if (env.IsDevelopment())
            {
                // list all my class libs I want to monitor
                string[] dirs = { "RazorClassLibRazorPage", "RazorClassLibRazorComponent" };

                builder.AddRazorRuntimeCompilation(options =>
                {
                    // add each to options file providers
                    foreach (var dir in dirs)
                    {
                        var libraryPath = Path.GetFullPath(Path.Combine(env.ContentRootPath, "..", dir));
                        options.FileProviders.Add(new PhysicalFileProvider(libraryPath));
                    }
                });
            }
#endif
@soeleman

This comment has been minimized.

Copy link

@soeleman soeleman commented Nov 1, 2019

@pranavkm thanks to point out the tracked issue dotnet/project-system#3163.

@FanrayMedia seem the extensions (AddRazorRuntimeCompilation) does not pick-up .razor files.
The suspect is FileProviderRazorProjectFileSystem.cs since this class handle only .cshtml file and did not see on other classes.
RCL has mechanism when dealing with razor files (.cshtml and .razor) as picture above.
AssetsOnProject
What we see on VS is the shadow of the file VS tracked. When we edit the file (.cshtml and .razor) the VS does not think to 'reload' the project as they only see the file within main project.
That why we need 'watcher' either dotnet-watch or FileProvider to trigger the 'reload'.

@FanrayMedia

This comment has been minimized.

Copy link
Author

@FanrayMedia FanrayMedia commented Nov 2, 2019

@soeleman thank you for the explanation, yeah it does look like FileProviderRazorProjectFileSystem.cs is handling only .cshtml, and it should handle .razor as well, is this something planned for next release? I also tried your pictures above, but so far no luck.

WebAppRazor.csproj

<ItemGroup Label="Global-Tool Watch">
    <Watch Include="..\RazorClassLibRazorComponent\**\*.razor" />
</ItemGroup>

launchSettings.json

    "WebAppRazor Watch": {
      "commandName": "Executable",
      "executablePath": "dotnet.exe",
      "launchBrowser": true,
      "workingDirectory": "$(ProjectDir)",
      "commandLineArgs": "watch run",
      "applicationUrl": "https://localhost:5001;http://localhost:5000",
      "environmentVariables": {
        "ASPNETCORE_ENVIRONMENT": "Development"
      }
    }
@soeleman

This comment has been minimized.

Copy link

@soeleman soeleman commented Nov 2, 2019

@FanrayMedia

is this something planned for next release?

hope so, may be already some where on branches.

I also tried your pictures above, but so far no luck.

Make sure you had dotnet-watch then running on non-debug.

From console:
dotnet-watch-run

From VS:
dotnet-watch-run-vs
Change to 'Watch' then Ctrl+F5

Modification of your sample
UnboxingNetCore3.zip

@FanrayMedia

This comment has been minimized.

Copy link
Author

@FanrayMedia FanrayMedia commented Nov 2, 2019

Thank you @soeleman it works now! Although my browser did not launch itself even with

"launchBrowser": true,
"launchUrl": "https://localhost:5001/"

is this an unknown issue?

@soeleman

This comment has been minimized.

Copy link

@soeleman soeleman commented Nov 2, 2019

@FanrayMedia

Although my browser did not launch itself

Yup, the commandName Executable did not read that property.
but we can use the cmd or other shell to running browser.
launchSettings-Watch-Chrome

is this an unknown issue?

Think so.

@msftbot msftbot bot locked as resolved and limited conversation to collaborators Dec 2, 2019
Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
Projects
None yet
5 participants
You can’t perform that action at this time.