Sadly I cannot because we are not in production with it. But if you bundle css the new way you describe with global assets I’m sure you’ll be able to reproduce the problem you’ll see the problem.
This is not correct. The href tag in my code is already /blazor/
Not really a solution more of a workaround. The solution would be to make these links recognize the UsePathBase value. I see this as an ABP bug.
[maliming] said: Once the application is built and starts. You can't modify
appsettings.json
. This is theMapStaticAssets
design.If you want to do that, you can use the code below.
context.SetEndpoint(null);
andapp.UseStaticFilesForPatterns("appsettings*.*");
will make appsettings.json as static file. So you can change it at runtime.
Yes, we have already discussed this. The core issue is that the url links in the global.css file for Volo.Abp.AspNetCore.Components.WebAssembly.Theming/* for some reason do not prefix with the value in 'UsePathBase'. I've gotten around this for the moment by adding the following to my css file that gets bundled with the global.css file.
I think there is a bug in ABP's code that is not changing the font awesome and bootstrap icons file links taking into account the value in UsePathBase, because all the other css file links other than these work correctly.
@font-face { font-family: 'Font Awesome 6 Free'; font-style: normal; font-weight: 900; font-display: block; src: url("../Blazor/_content/Volo.Abp.AspNetCore.Components.WebAssembly.Theming/libs/fontawesome/webfonts/fa-solid-900.woff2") format("woff2"),url("../Blazor/_content/Volo.Abp.AspNetCore.Components.WebAssembly.Theming/libs/fontawesome/webfonts/fa-solid-900.ttf") format("truetype") }
@font-face { font-family: 'Font Awesome 5 Free'; font-display: block; font-weight: 900; src: url("../Blazor/_content/Volo.Abp.AspNetCore.Components.WebAssembly.Theming/libs/fontawesome/webfonts/fa-solid-900.woff2") format("woff2"),url("../Blazor/_content/Volo.Abp.AspNetCore.Components.WebAssembly.Theming/libs/fontawesome/webfonts/fa-solid-900.ttf") format("truetype") }
@font-face { font-family: 'FontAwesome'; font-display: block; src: url("../Blazor/_content/Volo.Abp.AspNetCore.Components.WebAssembly.Theming/libs/fontawesome/webfonts/fa-solid-900.woff2") format("woff2"),url("../Blazor/_content/Volo.Abp.AspNetCore.Components.WebAssembly.Theming/libs/fontawesome/webfonts/fa-solid-900.ttf") format("truetype") }
@font-face { font-family: "bootstrap-icons"; src: url("../Blazor/_content/Volo.Abp.AspNetCore.Components.Web.LeptonXTheme/side-menu/libs/bootstrap-icons/font/fonts/bootstrap-icons.woff2?30af91bf14e37666a085fb8a161ff36d") format("woff2"),url("../Blazor/_content/Volo.Abp.AspNetCore.Components.Web.LeptonXTheme/side-menu/libs/bootstrap-icons/font/fonts/bootstrap-icons.woff?30af91bf14e37666a085fb8a161ff36d") format("woff") }
[maliming] said: How can I see the Font Awesome problem via https://github.com/spospisil/ABP_Issue project? Please share the steps.
I'm unable to reproduce it with your https://github.com/spospisil/StructureCloudTest project.
Thanks.
Maliming,
That ticket is another issue all together, but I believe if you solve that ticket it will also fix this ticket as well.
I've already provided you with our code that reproduces the missing icon issue.
Hi,
Using the code below I can now run my project without error as it relates to the appsetttings file....but the font icons still do not show. the issue seems to be that the url specified in the css file for font-face..... is not being prefixed with /Blazor/_content.... but rather is just coming across as /_content.... The url links in the css files seem to be the only links not picking up the /Blazor prefix. All other related .css and .js files are being prefixed with the /Blazor literal.
Why are the font awesome css urls different?
// The trailing slash is important
app.UsePathBase("/Blazor/"); // MUST be first to affect static and routing paths
app.Use(async (context, next) =>
{
if (context.Request.Path.Value != null &&
context.Request.Path.Value.StartsWith("/appsettings", StringComparison.OrdinalIgnoreCase))
{
// Set endpoint to null so the static files middleware will handle the request.
context.SetEndpoint(null);
}
await next(context);
});
app.UseStaticFilesForPatterns("appsettings*.*");
app.MapAbpStaticAssets();
Ok,
I am creating a different ticket for an error I have (briefly mentioned above) that is preventing me from using app.MapAbpStaticAssets which is why I think I cannot get the font awesome icons to display so if we solve this other ticket's issue I think this issue will be resolved as well.
This is the new ticket I created
https://abp.io/support/questions/9695/Error-when-Launching-Blazor-WASM
Hi,
I am getting the below error when I am launching my Blazor WASM application. I believe it's happening because the app.MapAbpStaticAssets is trying to retrieve my appsettings.json file from the Virtural File System, but I always want it to be served from wwwroot. Part of what complicates this is we want our application to be serviced from a subfolder of "/Blazor", so we are using the app.UsePathBase method.
At runtime we dynamically populate the appsettings.json file with configurable values from our container environment which is why I need the above functionality. Based on another ticket (https://abp.io/support/questions/9666/Fontawesome-Icons-Not-Showing#answer-3a1b6d7e-4e0e-c8aa-30c8-249d1caa71f8) I believe this is why my font awesome icons are not showing so if I can resolve this issue I think it'll resolve my other issue.
I've created a github repo with a sample project created with ABP Studio and the code to reproduce the issue. If you can examine the code in the TestWasmBlazorModule and tell me if I have it correct in order to do what I detailed above that would be helpful.
I've shared access to this repo with maliming
I’ve already tried recreating in a sample project and I suspect the issue isn’t the our code but rather something not working with Abp when running in a containerized environment and using the Setbasepath code.
Would probably be easier if you created a project that is containerized (like our project is).