SoloX.BlazorJsonLocalization 1.0.0-alpha.1

BlazorJsonLocalization

Provides JSON-based Blazor localization support.

Don't hesitate to post issue, pull request on the project or to fork and improve the project.

License and credits

BlazorJsonLocalization project is written by Xavier Solau. It's licensed under the MIT license.

Installation

You can checkout this Github repository or you can use the NuGet package:

Install using the command line from the Package Manager:

Install-Package SoloX.BlazorJsonLocalization -version 1.0.0-alpha.1

Install using the .Net CLI:

dotnet add package SoloX.BlazorJsonLocalization --version 1.0.0-alpha.1

Install editing your project file (csproj):

<PackageReference Include="SoloX.BlazorJsonLocalization" Version="1.0.0-alpha.1" />

How to use it

Note that you can find code examples in this repository in this location: src/examples.

Setup the localizer using embedded Json resources file

Blazor Wasm Version

A few lines of code are actually needed to setup the BlazorJsonLocalizer. You just need to use the name space SoloX.BlazorJsonLocalization to get access to right extension methods and to setup the services in you Program.cs file :

// Here we are going to store the Json files in the project 'Resources' folder.
builder.Services.AddJsonLocalization(
    builder => builder.UseEmbeddedJson(
        options => options.ResourcesPath = "Resources"));

Let's say that we are going to use the localization in the Index page. The first thing to do is to create your Json resource files that are actually going to contain the translated text. You will add the Json files in the project "Resources" folder (since we have defined it in the options ResourcesPath property).

The file must be named with the component name (In our case Index) and suffixed with the ISO2 language code:

For example the English Json file will look like this:

{
  "Hello": "Hello world!",
  "Welcome": "Welcome to your new app."
}

and the French file:

{
  "Hello": "Bonjour tout le monde!",
  "Welcome": "Bienvenue dans votre nouvelle application."
}

The Json file need to be declared as Embedded resources in order to be shipped in the Assembly. You can do it this way in your csproj file:

  <ItemGroup>
    <Content Remove="Resources\Index-fr.json" />
    
    <Content Remove="Resources\Index.json" />
  </ItemGroup>

  <ItemGroup>
    <EmbeddedResource Include="Resources\Index-fr.json" />
    
    <EmbeddedResource Include="Resources\Index.json" />
  </ItemGroup>

Then you will need to inject the IStringLocalizer<Index> in the Index class:

[Inject]
private IStringLocalizer<Index> L { get; set; }

or using the razor syntax:

@inject IStringLocalizer<Index> L

with the using declared in your _Imorts.razor:

@using Microsoft.Extensions.Localization

Once the localizer is available you can just use it like this:

@page "/"

<h1>@L["Hello"]</h1>

@L["Welcome"]