Css isolation
# help-with-umbraco
d
Since .Net 6 MVC support css isolation for views, Umbraco seems to lack this feature. Is it possible to enable it, or does it just not work with Umbraco?
j
It won't work with Umbraco so long as Razor Runtime Compilation is enabled. IIRC it's enabled in core by default and is not configurable. It's worth asking the question why that's the case and if there's scope for being able to optionally turn it off.
Interestingly, it's disabled for production mode so it mustn't be important for Umbraco's operation generally. Just need to to find a good way to configure it, maybe it's own app setting or a different runtime mode.
m
Isnt that a csproj setting you can delete if you not using in memory auto for models builder @Jason ?
d
🤔 interesting, especially knowing that development works find if you don't use it
I mean I get the setting kind of if you need to edit and see changes on the fly, but quite sure that works with MVC anyhow nowadays
Hmm correction there, I do need to restart in a normal app. So the next question then would be, why do we need to disable hot reload for Umbraco, as that is the sideffect of having this setting next to not having css isolation
j
In short: in-memory models, and editing of views via the backoffice while the app is running.
Runtime compilation is necessary to support those use cases, which is still the default in Umbraco.
d
Yeah, but that IS configurable, so this really should as well imo 🙂 Nevertheless, you showed me where to look, so I now trying to fly my own custom .AddBackoffice()
In that sense this issue is the same as the issue I have with the program.cs in general. Too much is hidden away in extensions methods to make it "easy", especially considering order is so important.
Yuk, it does more in development mode...... If I don't use it, even if I restart my app, the view can not be found :/
Ah, needed some stuff from the csproj
So, I added this class and replace AddBackOffice with AddCustomBackOffice
Copy code
csharp
public static class UmbracoBuilderExtensionsOwning
{
    public static IUmbracoBuilder AddCustomBackOffice(this IUmbracoBuilder builder) => builder
        .AddConfiguration()
        .AddUmbracoCore()
        .AddWebComponents()
        .AddHelpers()
        .AddBackOfficeCore()
        .AddBackOfficeIdentity()
        .AddBackOfficeAuthentication()
        .AddTokenRevocation()
        .AddMembersIdentity()
        .AddUmbracoProfiler()
        .AddMvcAndRazorWithHotReload()
        .AddWebServer()
        .AddRecurringBackgroundJobs()
        .AddNuCache()
        .AddDistributedCache()
        .AddCoreNotifications()
        .AddExamine()
        .AddExamineIndexes();

    private static IUmbracoBuilder AddMvcAndRazorWithHotReload(this IUmbracoBuilder builder, Action<IMvcBuilder>? mvcBuilding = null)
    {
        // TODO: We need to figure out if we can work around this because calling AddControllersWithViews modifies the global app and order is very important
        // this will directly affect developers who need to call that themselves.
        IMvcBuilder mvcBuilder = builder.Services.AddControllersWithViews();

        mvcBuilding?.Invoke(mvcBuilder);

        return builder;
    }
}
Set the modelsbuilder
Copy code
json
"Umbraco": {
    "CMS": {
      "ModelsBuilder": {
        "AcceptUnsafeModelsDirectory": true,
        "ModelsNamespace": "Umbraco.Cms.Web.Common.PublishedModels",
        "ModelsDirectory": "~/umbraco/models",
        "ModelsMode": "SourceCodeAuto"
      },
...
Removed from csproj:
Copy code
xml
<PropertyGroup>
    <!-- Remove RazorCompileOnBuild and RazorCompileOnPublish when not using ModelsMode InMemoryAuto -->
    <RazorCompileOnBuild>false</RazorCompileOnBuild>
    <RazorCompileOnPublish>false</RazorCompileOnPublish>
</PropertyGroup>
and added:
Copy code
xml
<ItemGroup>
    <Watch Include="$(MSBuildProjectDirectory)\**\*.cshtml" />
</ItemGroup>
And it work like a charm so far
interesting thing, the last step is not needed for a vanilla MVC application to watch cshtml
m
Might be worth starting a discussion on GitHub around all this , as it might be something HQ can make easier to do
d
Good idea 🙂 I'll post this workaround there as well, but if we can get it "native" that would be great
9 Views