Piral.Blazor.Shared
0.5.0-preview.9323268279
dotnet add package Piral.Blazor.Shared --version 0.5.0-preview.9323268279
NuGet\Install-Package Piral.Blazor.Shared -Version 0.5.0-preview.9323268279
<PackageReference Include="Piral.Blazor.Shared" Version="0.5.0-preview.9323268279" />
paket add Piral.Blazor.Shared --version 0.5.0-preview.9323268279
#r "nuget: Piral.Blazor.Shared, 0.5.0-preview.9323268279"
// Install Piral.Blazor.Shared as a Cake Addin #addin nuget:?package=Piral.Blazor.Shared&version=0.5.0-preview.9323268279&prerelease // Install Piral.Blazor.Shared as a Cake Tool #tool nuget:?package=Piral.Blazor.Shared&version=0.5.0-preview.9323268279&prerelease
Piral.Blazor.Shared ·
|
![Gitter Chat](https://badges.gitter.im/gitterHQ/gitter.png)
The shared module with common type definitions for micro frontends using Blazor.
Installation & Setup
This is a shared library that will be automatically installed and used with Piral.Blazor.Orchestrator
or in a micro frontend when you leverage the Piral.Blazor.Sdk
SDK like this:
<Project Sdk="Piral.Blazor.Sdk/0.5.0">
<PropertyGroup>
<TargetFramework>net8.0</TargetFramework>
<Version>1.0.0</Version>
<Nullable>enable</Nullable>
<ImplicitUsings>enable</ImplicitUsings>
<AppShell>My.Emulator/0.1.0</AppShell>
</PropertyGroup>
<ItemGroup>
<PackageReference Include="BlazorGoogleMaps" Version="3.1.2" />
<PackageReference Include="BlazorOcticons" Version="1.0.4" />
</ItemGroup>
</Project>
The example shows a micro frontend using an app shell deployed as My.Emulator
in version 1.0.0
. The micro frontend brings its own dependencies, namely BlazorGoogleMaps
and BlazorOcticons
.
Creating Micro Frontends
Prerequisites
From scratch you can create a new Razor Component Library (RCL) project. By changing the csproj file's SDK to Piral.Blazor.Sdk
you will be able to debug / develop this very conveniently.
The RCL has to be for .NET 8.
Module Definition / Registration and Usage of Components
In order to be a valid micro frontend there has to be one public class that inherits from IMfModule
:
public class Module : IMfModule
{
public Module(IConfiguration configuration)
{
// Inject here what you want, e.g., the global `IConfiguration`.
}
public void Configure(IServiceCollection services)
{
// Configure your services in this function
}
public Task Setup(IMfAppService app)
{
// Register components and more
return Task.CompletedTask;
}
public Task Teardown(IMfAppService app)
{
// Unregister things that need to be cleaned up
return Task.CompletedTask;
}
}
In the Setup
function you can wire up your components to names that can be used on the outside. For instance, to wire up a MapComponent
Razor component to an outside name of "mfa-map" you can do:
app.MapComponent<MapComponent>("mfa-map");
If you need to set up more things - such as scripts or stylesheets used by your dependencies you'd do:
app.AppendScript($"https://mycdn.com/some-global-script.js");
app.AppendScript("_content/BlazorGoogleMaps/js/objectManager.js");
The paths will be set up / configured correctly by the app shell.
Dependencies
Just install your dependencies as you like; if they are correctly in the csproj they will be correctly in the NuGet package.
Using Components from Micro Frontends
To use a component (such as "mfa-components" - this name is defined by the micro frontend calling the MapComponent
method of the IMfAppService
instance passed to their module definition - see below) without any parameters:
<MfComponent Name="mfa-component" />
You can also specify parameters if necessary / wanted:
<MfComponent Name="mfa-component" Parameters="@parameters" />
where
private Dictionary<string, object> parameters = new Dictionary<string, object>
{
{ "Foo", 5 }
};
The MfComponent
component is available in the Piral.Blazor.Shared
NuGet package. It can be used in the server / app shell or in any micro frontend.
Alternatively, you can also specify parameters directly, e.g., for the previous example you could also write:
<MfComponent Name="mfa-component" Foo="5" />
Product | Versions Compatible and additional computed target framework versions. |
---|---|
.NET | net8.0 is compatible. net8.0-android was computed. net8.0-browser was computed. net8.0-ios was computed. net8.0-maccatalyst was computed. net8.0-macos was computed. net8.0-tvos was computed. net8.0-windows was computed. |
-
net8.0
- Microsoft.AspNetCore.Components.Web (>= 8.0.1)
NuGet packages (1)
Showing the top 1 NuGet packages that depend on Piral.Blazor.Shared:
Package | Downloads |
---|---|
Piral.Blazor.Orchestrator
The orchestration module for creating server-side micro frontends using Blazor. |
GitHub repositories
This package is not used by any popular GitHub repositories.