I am updating my Blazor App. This uses WebAssembly and Blazorise and I need to do to make my home page work properly and load quickly. I am struggling to make the Interactive server mode work with Blazorise Layouts.
I decided to try out building a new app using the Blazorise VS Template to understand better. (Interactive Server) With a view to adding Interactive WebAsssembly down the way.
The Blazorise Template creates an app that does indeed work with the Layouts in Interactive Server mode. But it does this by jumping through some hoops using an unconventional approach to the app structure. Maybe this is necessary to make it work.e.g. It uses a _Host.cshtml and _Layout.cshtml file.However, if I try to add the InteractiveWebAssembly into the program.cs it fails on loading.
This is the program.cs:
using Blazorise.Bootstrap5;using Blazorise.Icons.FontAwesome;using BlazoriseTestAppServer;using MudBlazorServerTestApp.Client.Widgets; <<< This is for my test widgetvar builder = WebApplication.CreateBuilder(args);// Add services to the container.builder.Services.AddRazorPages();builder.Services.AddServerSideBlazor() .AddInteractiveServerComponents(); //.AddInteractiveWebAssemblyComponents(); << Should add to make WASM workAddBlazorise(builder.Services);var app = builder.Build();// Configure the HTTP request pipeline.if (!app.Environment.IsDevelopment()){ 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();app.UseRouting();app.MapBlazorHub();app.MapFallbackToPage("/_Host");app.UseAntiforgery();app.MapStaticAssets();//app.MapRazorComponents<App>(); <<< Should add to make WASM work// .AddInteractiveServerRenderMode(); (If I add this code then it breaks)// .AddInteractiveWebAssemblyRenderMode();// .AddAdditionalAssemblies(typeof(DCounter).Assembly); << This is my test widgetapp.Run();void AddBlazorise(IServiceCollection services){ services .AddBlazorise(); services .AddBootstrap5Providers() .AddFontAwesomeIcons();}The _Hosts.cshtml file:
@page "/"@namespace BlazoriseTestAppServer.Pages@addTagHelper *, Microsoft.AspNetCore.Mvc.TagHelpers@{ Layout = "_Layout";}<component type="typeof(App)" render-mode="Server" />This is the _Layout.cshtml file:
@using Microsoft.AspNetCore.Components.Web@namespace BlazoriseTestAppServer.Pages@addTagHelper *, Microsoft.AspNetCore.Mvc.TagHelpers<!DOCTYPE html><html lang="en"><head><meta charset="utf-8" /><meta name="viewport" content="width=device-width, initial-scale=1.0" /><title>BlazoriseTestAppServer</title><base href="~/" /><component type="typeof(HeadOutlet)" render-mode="Server" /><link href="https://cdn.jsdelivr.net/npm/bootstrap@5.1.1/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-F3w7mX95PdgyTmZZMECAngseQB83DfGTowi0iMjiWaeVhAn4FJkqJByhZMI3AhiU" crossorigin="anonymous"><link href="_content/Blazorise.Icons.FontAwesome/v6/css/all.min.css" rel="stylesheet"><link href="_content/Blazorise/blazorise.min.css?v=1.8.0.0" rel="stylesheet" /><link href="_content/Blazorise.Bootstrap5/blazorise.bootstrap5.min.css?v=1.8.0.0" rel="stylesheet" /><link href="BlazoriseTestAppServer.Styles.css" rel="stylesheet" /><link rel="stylesheet" href="css/blazor-ui.css" /></head><body> @RenderBody()<div id="blazor-error-ui"><environment include="Staging,Production"> An error has occurred. This application may no longer respond until reloaded.</environment><environment include="Development"> An unhandled exception has occurred. See browser dev tools for details.</environment><a href="" class="reload">Reload</a><a class="dismiss">🗙</a></div><script src="_framework/blazor.server.js"></script></body></html>Any ideas on how to add Interactive WebAssembly for this project