Search code examples
blazorblazor-webassembly

Blazor with .NET 8: Getting error with adding interactive component to Server project


When I create a new Blazor solution using .NET 8, enabling webassembly, I get two projects, Client and Server.

I can add components with

@rendermode InteractiveAuto

to the Pages/ folder of the Client project and they work fine.

When I do the same for the server project, I get this message in the browser developer console:

"Error: One or more errors occurred. (Root component type 'LearnBlazor.Components.Whatever' could not be found in the assembly 'LearnBlazor'"  

where LearnBlazor is the server side.

I tried adding a line here in the server project's Program.cs:

app.MapRazorComponents<App>()
    .AddInteractiveServerRenderMode()
    .AddInteractiveWebAssemblyRenderMode()
    .AddAdditionalAssemblies(typeof(LearnBlazor.Client._Imports).Assembly)
    .AddAdditionalAssemblies(typeof(LearnBlazor.Components.Pages.ComponentNotWorking).Assembly)

But this raises an exception (assembly already added).

I have studied Blazor on a Pluralsight course (Blazor Fundamentals, to be precise) and Microsoft Learn, but neither course covers both client and server projects. The courses both use single project solutions.

Yes, I know that adding the component to the Client project makes it work, but I would like to know if its possible on the server as well and if so how to do it.

Additionally I'd like to know if there's any valid use cases for adding interactive components to the server side. I doubt it as the client is the one handling clicks, but I ask to be sure.


Solution

    1. Server-side rendering can use static SSR and interactive SSR.
    2. Components using the Auto render mode must be built from a separate client project that sets up the Blazor WebAssembly host.
    3. If using the preceding component locally in a Blazor Web App, place the component in the client project's Pages folder. The client project is the solution's project with a name that ends in .Client.
    4. You can refer to the official document: https://learn.microsoft.com/en-us/aspnet/core/blazor/components/render-modes?view=aspnetcore-8.0