I have a Blazor 8 app that I have just created and I am battling to add a HTML template's resources that I purchased from one of the theme sites. I am using .NET 8 Preview, out of the box it already comes with its own css file in the wwwroot. What I did is extract the html template, the drag the resources into an assets folder under the wwwroot. I think reference these in the App.razor page. However when I run the application in any browser I get the type of errors below:
Example errors, this errors for all the files:
Failed to load resource: the server responded with a status of 404 ()icons.min.cssFailed to load resource: the server responded with astatus of 404 () jquery.min.js
Program.cs
var builder = WebApplication.CreateBuilder(args);//Tried this and its not workingbuilder.WebHost.UseWebRoot("wwwroot");builder.WebHost.UseStaticWebAssets();// Add services to the container.builder.Services.AddRazorComponents() .AddServerComponents() .AddWebAssemblyComponents();var app = builder.Build();// Configure the HTTP request pipeline.if (app.Environment.IsDevelopment()){ app.UseWebAssemblyDebugging();}else{ app.UseExceptionHandler("/Error"); // The default HSTS value is 30 days. You may want to change this for production scenarios, see https://aka.ms/aspnetcore-hsts. app.UseHsts();}app.UseHttpsRedirection();app.UseStaticFiles(); //this does not work tooapp.MapRazorComponents<App>() .AddServerRenderMode() .AddWebAssemblyRenderMode();app.Run();App.razor:
<!DOCTYPE html><html lang="en"><head><meta charset="utf-8" /><meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no" /><base href="/" /><link rel="stylesheet" href="bootstrap/bootstrap.min.css" /><link rel="stylesheet" href="assets/css/icons.min.css" /><link rel="stylesheet" href="app.css" /><link rel="stylesheet" href="Venoo.Admin.styles.css" /><link rel="icon" type="image/png" href="favicon.png" /><!-- Bootstrap Css --><link href="assets/css/bootstrap.min.css" id="bootstrap-style" rel="stylesheet" type="text/css" /><!-- Icons Css --><link rel="stylesheet" href="assets/css/icons.min.css" /><!-- App Css--><link href="Venoo/assets/css/app.min.css" id="app-style" rel="stylesheet" type="text/css" /><HeadOutlet /></head><body data-sidebar="light"><Routes /><!-- JAVASCRIPT --><script src="assets/libs/jquery/jquery.min.js"></script><script src="assets/libs/bootstrap/js/bootstrap.bundle.min.js"></script><script src="assets/libs/metismenu/metisMenu.min.js"></script><script src="assets/libs/simplebar/simplebar.min.js"></script><script src="assets/libs/node-waves/waves.min.js"></script><!-- apexcharts --><script src="assets/libs/apexcharts/apexcharts.min.js"></script><!-- dashboard init --><script src="assets/js/pages/dashboard.init.js"></script><!-- App js --><script src="assets/js/app.js"></script><script src="_framework/blazor.web.js"></script></body></html>Any assistance would be appreciated on how to get this to work, it seems like a simple use case and not every application should look like the default bootstrap template.