Blazor Web App - Persist Style & Scripts

[enisn]

Description

before:

after:

Checklist

• I fully tested it as developer / designer and created unit / integration tests
• I documented it (or no need to document or I will create a separate documentation issue)

How to test it?

Please describe how this can be tested by the test engineers if it is not already explicit - or remove this section if no need to description.

[maliming]

It seems the mvc and blazor js&css both exist on wasm mode after this PR.

This is a problem. @enisn what do you think?

[maliming]

We will switch the CSS files for the Blazor server and WASM. This is the reason the page will flash once(Like image 1).

style-initializer.js

loadCssFile("_content/Volo.Abp.AspNetCore.Components.Web.LeptonXLiteTheme/side-menu/css/abp-bundle.css");
loadCssFile("_content/Volo.Abp.AspNetCore.Components.Web.LeptonXLiteTheme/side-menu/css/blazor-bundle.css");
loadCssFile("_content/Volo.Abp.AspNetCore.Components.Web.LeptonXLiteTheme/side-menu/css/bootstrap-dim.css");
loadCssFile('_content/Volo.Abp.AspNetCore.Components.Web.LeptonXLiteTheme/side-menu/css/layout-bundle.css');
loadCssFile('_content/Volo.Abp.AspNetCore.Components.Web.LeptonXLiteTheme/side-menu/css/font-bundle.css');

We can add one common lepton CSS file for the server and WASM in the App.razor component. This will prevent the flash problem.

[enisn]

It seems the mvc and blazor js&css both exist on wasm mode after this PR.

This is a problem. @enisn what do you think?

When we remove mvc & blazor server css and add blazor css, it cause a flicker effect. Since we remove and reload entire CSSs. In the lepton, there are no difference in CSS files. No need to remove and reload all of them.

We can add one common lepton CSS file for the server and WASM in the App.razor component. This will prevent the flash problem.

That might be a better solution 👍

[maliming]

#19970