How to migrate Blazor WebAssembly App to .NET 5
What you will learn:
- Steps to migrate existing Blazor WebAssembly application to .NET 5
Step 1: Install the latest version of Visual Studio
from the Microsoft website.
Step 2: Change the first line in your Blazor WebAssembly project file (.csproj file) from Microsoft.NET.Sdk.Web
to Microsoft.NET.Sdk.BlazorWebAssembly
.
Sample Code (Before):
<Project Sdk="Microsoft.NET.Sdk.Web">
.....
</Project>
Sample Code (After):
<Project Sdk="Microsoft.NET.Sdk.BlazorWebAssembly">
...
</Project>
Step 3: Change the target framework to .NET 5
.
Sample Code (Before):
<Project Sdk="Microsoft.NET.Sdk.Web">
<PropertyGroup>
<TargetFramework>netstandard2.1</TargetFramework>
<RazorLangVersion>3.0</RazorLangVersion>
</PropertyGroup>
<ItemGroup>
...
</ItemGroup>
</Project>
Sample Code (After):
<Project Sdk="Microsoft.NET.Sdk.BlazorWebAssembly">
<PropertyGroup>
<TargetFramework>net5.0</TargetFramework>
<RazorLangVersion>3.0</RazorLangVersion>
</PropertyGroup>
<ItemGroup>
...
</ItemGroup>
</Project>
Step 4: Update other packages to 5.0.0
(Microsoft.AspNetCore.*, System.Net.Http.Json, Microsoft.EntityFrameworkCore, etc.)
Step 5: Remove Microsoft.AspNetCore.Components.WebAssembly.Build
from .csproj
file.
<PackageReference Include="Microsoft.AspNetCore.Components.WebAssembly.Build" Version="3.2.0" PrivateAssets="all" />
Step 6: Finally, it looks as below.
<Project Sdk="Microsoft.NET.Sdk.BlazorWebAssembly">
<PropertyGroup>
<TargetFramework>net5.0</TargetFramework>
<RazorLangVersion>3.0</RazorLangVersion>
</PropertyGroup>
<ItemGroup>
<PackageReference Include="Microsoft.AspNetCore.Components.WebAssembly" Version="5.0.0" />
<PackageReference Include="Microsoft.AspNetCore.Components.WebAssembly.DevServer" Version="5.0.0" PrivateAssets="all" />
<PackageReference Include="System.Net.Http.Json" Version="5.0.0" />
</ItemGroup>
</Project>
We hope you like this article.
Read more articles on Blazor here.
-
CreatedDec 05, 2020
-
UpdatedDec 05, 2020
-
Views1,660
Related Articles
Fixed: Blazor Webassembly - Google Authentication Issue - Access to XMLHttpRequest at 'https://login.microsoftonline.com/.well-known/openid-configuration' from origin 'https://localhost:7215' has been blocked by CORS policy: No 'Access-Control-Allow-Origin' header is present on the requested resource.
Blazor Bootstrap: Tooltip Component Examples
Blazor Bootstrap: Alert Component Examples
Blazor Bootstrap: Icon Component Examples
Blazor Bootstrap: Toasts Component Examples
Blazor Bootstrap: Modal Component Examples
Blazor Bootstrap: Offcanvas examples
Blazor Bootstrap: Button Examples
Blazor Bootstrap: Quick Start
Blazor: How to bind employees to table / grid