[SOLVED] Blazor Webassembly localization set in index.html does not have any effect

Blazor Webassembly localization set in index.html does not have any effect

I've followed the instructions at https://learn.microsoft.com/en-us/aspnet/core/blazor/globalization-localization?view=aspnetcore-7.0&pivots=webassembly

But the culture does not get set as expected.

index.html

<head>
    <meta charset="utf-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no" />
    <base href="/" />
    <link href="css/bootstrap/bootstrap.min.css" rel="stylesheet" />
    <link href="css/app.css" rel="stylesheet" />
    <link rel="icon" type="image/png" href="favicon.png" />
    <link href="Test.WebAssembly.Client.styles.css" rel="stylesheet" />
    <link href="https://cdn.syncfusion.com/blazor/21.1.41/styles/bootstrap5.css" rel="stylesheet" />
    <script src="https://cdn.syncfusion.com/blazor/21.1.41/syncfusion-blazor.min.js"  type="text/javascript"></script>
</head>

<body>
    <div id="app">
        <svg class="loading-progress">
            <circle r="40%" cx="50%" cy="50%" />
            <circle r="40%" cx="50%" cy="50%" />
        </svg>
        <div class="loading-progress-text"></div>
    </div>

    <div id="blazor-error-ui">
        An unhandled error has occurred.
        <a href="" class="reload">Reload</a>
        <a class="dismiss">🗙</a>
    </div>
    <script src="_framework/blazor.webassembly.js" autostart="false"></script>
    <script>
        Blazor.start({
            applicationCulture: 'de'
        });
    </script>
</body>

</html>

Here's some code from the Blazor Index page

<h2>The Current culture is "@CultureInfo.CurrentCulture"</h2>

which is displayed as

The Current culture is "en-US"

I would expect "de" here.

Solution file

<Project Sdk="Microsoft.NET.Sdk.BlazorWebAssembly">

    <PropertyGroup>
        <TargetFramework>net7.0</TargetFramework>
        <Nullable>enable</Nullable>
        <ImplicitUsings>enable</ImplicitUsings>
        <BlazorWebAssemblyLoadAllGlobalizationData>true</BlazorWebAssemblyLoadAllGlobalizationData>
    </PropertyGroup>

    <ItemGroup>
        <PackageReference Include="AutoMapper" Version="12.0.1" />
        <PackageReference Include="AutoMapper.Extensions.Microsoft.DependencyInjection" Version="12.0.1" />
        <PackageReference Include="Microsoft.AspNetCore.Components.Authorization" Version="7.0.5" />
        <PackageReference Include="Microsoft.AspNetCore.Components.WebAssembly" Version="7.0.5" />
        <PackageReference Include="Microsoft.AspNetCore.Components.WebAssembly.DevServer" Version="7.0.5" PrivateAssets="all" />
        <PackageReference Include="Syncfusion.Blazor.Grid" Version="21.1.41" />
    </ItemGroup>

    <ItemGroup>
        <ProjectReference Include="..\..\Test.Core\Test.Core.csproj" />
        <ProjectReference Include="..\Shared\Test.Server.Blazor.WebAssembly.Shared.csproj" />
    </ItemGroup>

    <ItemGroup>
        <Compile Update="Resources\SfResources.Designer.cs">
            <DesignTime>True</DesignTime>
            <AutoGen>True</AutoGen>
            <DependentUpon>SfResources.resx</DependentUpon>
        </Compile>
    </ItemGroup>

    <ItemGroup>
        <EmbeddedResource Update="Resources\SfResources.resx">
            <Generator>PublicResXFileCodeGenerator</Generator>
            <LastGenOutput>SfResources.Designer.cs</LastGenOutput>
        </EmbeddedResource>
    </ItemGroup>

</Project>

What's missing?

Solution

I finally found the reason for the issue. The instructions found at the Microsoft link works fine. My mistake was that I added the

<BlazorWebAssemblyLoadAllGlobalizationData>true</BlazorWebAssemblyLoadAllGlobalizationData>

To the solution file for the WebAssembly client, and not the asp.net core project that hosted the client. Moved to the correct solution file, it all works as expected.