This browser is no longer supported.
Upgrade to Microsoft Edge to take advantage of the latest features, security updates, and technical support.
![](data:image/svg+xml, %3Csvg xmlns='http://www.w3.org/2000/svg' height='64' class='font-weight-bold' style='font: 600 30.11764705882353px "SegoeUI", Arial' width='64'%3E%3Ccircle fill='hsl(6.4, 49%, 10%)' cx='32' cy='32' r='32' /%3E%3Ctext x='50%25' y='55%25' dominant-baseline='middle' text-anchor='middle' fill='%23FFF' %3EG%3C/text%3E%3C/svg%3E)
I have a functioning Blazor WebAssembly (WASM) component that I would like to share with other apps. The component is ASP.NET Core hosted and my solution contains multiple project files (client, server, shared). The client-side project (the component) interacts with Web API endpoints in a controller file in the server-side project to pull data from a SQL Server database.
What I am unsure of is how to best share a WASM component with multiple other projects in a ASP.NET Core hosted environment. Apparently, directly adding/referencing the client-side WASM project does not work and using Razor Class Libraries (RCLs) is the suggested recommended approach (reference). However, I have been unable to find information on using RCLs in a hosted environment where a component-specific controller is involved.
How can I best share my client-side Blazor WASM component including its server-side controller using a single Razor Class Library? Is this even possible?
![](data:image/svg+xml, %3Csvg xmlns='http://www.w3.org/2000/svg' height='64' class='font-weight-bold' style='font: 600 30.11764705882353px "SegoeUI", Arial' width='64'%3E%3Ccircle fill='hsl(73.60000000000001, 90%, 17%)' cx='32' cy='32' r='32' /%3E%3Ctext x='50%25' y='55%25' dominant-baseline='middle' text-anchor='middle' fill='%23FFF' %3EZL%3C/text%3E%3C/svg%3E)
Hi @geoCode ,
You can add the required Razor views, pages, controllers, page models, Razor components, View components, and data models (from the client, server or shared folder) into the Razor class library (RCL), then use it in another application.
Refer to the following articles to use RCL:
Create reusable UI using the Razor class library project in ASP.NET Core
Consume ASP.NET Core Razor components from Razor class libraries
Best regards,
Dillion
Thanks for the answer. I read the documents and tried what you suggested but cannot get the controller to work. It has a using directive to Microsoft.AspNetCore.Mvc which cannot locate its assembly reference when it is moved to the RCL. If I add the assembly's NuGet package to the component project I get an error which apparently is caused by referencing a library that targets ASP.NET Core from a Blazor Webassembly application - see error and explanation here. Is there a way to put the controller from the server-side project into the client-side RCL or are separate RCLs required?
Hi @geoCode ,
If I add the assembly's NuGet package to the component project I get an error which apparently is caused by referencing a library that targets ASP.NET Core from a Blazor Webassembly application - see error and explanation here.
It seems that you have already found the solution, the Razor class library (with support for pages and views) are not working with the Blazor Webassembly client application, because to use the RCL class library, it need to install the Microsoft.AspNetCore.Mvc framework, and this framework can't install in the Blazor Webassembly client application.
But I also found that the Razor class library can used in the Blazor Server application. So, you could try to create a Asp.net core Hosted Blazor WebAssembly application (refer to the following screenshot and checked the Asp.net Core Host), then it will create an application with three projects (client, server and shared), you can add the RCL in the server side application.
Best regards,
Dillion
I am already using a Blazor ASP.NET Hosted application with client, server, and shared projects. What I was trying to do was package both client and server classes into a single RCL so the component is truly self-contained (i.e., the client-side classes and corresponding server-side controller classes are in the same file). Apparently this is not presently possible and I would need one RCL for the client-side project and a different RCL for the server-side project.
I ended up converting to Blazor Server and the RCL is working well (for my project I believe this is a better overall solution anyway). See related post: StackOverflow 71151152 . I have also update the question to reflect that I am looking for a way to combine everything into a single RCL. Thanks.
![](data:image/svg+xml, %3Csvg xmlns='http://www.w3.org/2000/svg' height='64' class='font-weight-bold' style='font: 600 30.11764705882353px "SegoeUI", Arial' width='64'%3E%3Ccircle fill='hsl(211.20000000000002, 61%, 30%)' cx='32' cy='32' r='32' /%3E%3Ctext x='50%25' y='55%25' dominant-baseline='middle' text-anchor='middle' fill='%23FFF' %3EBS%3C/text%3E%3C/svg%3E)
as the WASM and server are separate projects, you probably need 3 projects. one for the shared code, one for the Blazor components, and one for the server project.
Thanks - but my project is already a .NET-core hosted project (I edited my question to clarify this).