Create an account


Thread Rating:
  • 0 Vote(s) - 0 Average
  • 1
  • 2
  • 3
  • 4
  • 5
Blazor WebAssembly 3.2.0 Preview 1 release now available

#1
Blazor WebAssembly 3.2.0 Preview 1 release now available

<div style="margin: 5px 5% 10px 5%;"><img src="https://www.sickgaming.net/blog/wp-content/uploads/2020/01/blazor-webassembly-3-2-0-preview-1-release-now-available.jpg" width="150" height="150" title="" alt="" /></div><div><div class="row justify-content-center">
<div class="col-md-4">
<div><img src="https://www.sickgaming.net/blog/wp-content/uploads/2020/01/blazor-webassembly-3-2-0-preview-1-release-now-available.jpg" width="58" height="58" alt="Daniel Roth" class="avatar avatar-58 wp-user-avatar wp-user-avatar-58 alignnone photo"></p>
<p>Daniel</p>
</div>
</div>
</div>
<div class="entry-meta">
<p>January 28th, 2020</p>
</p></div>
<p><!-- .entry-meta --> </p>
<p>Today we released a new preview update for Blazor WebAssembly with a bunch of great new features and improvements.</p>
<p>Here’s what’s new in this release:</p>
<ul>
<li>Version updated to 3.2</li>
<li>Simplified startup</li>
<li>Download size improvements</li>
<li>Support for .NET SignalR client</li>
</ul>
<h2>Get started</h2>
<p>To get started with Blazor WebAssembly 3.2.0 Preview 1 <a href="https://dotnet.microsoft.com/download/dotnet-core/3.1">install the .NET Core 3.1 SDK</a> and then run the following command:</p>
<pre><code>dotnet new -i Microsoft.AspNetCore.Blazor.Templates::3.2.0-preview1.20073.1
</code></pre>
<p>That’s it! You can find additional docs and samples on <a href="https://blazor.net">https://blazor.net</a>.</p>
<h2>Upgrade an existing project</h2>
<p>To upgrade an existing Blazor WebAssembly app from 3.1.0 Preview 4 to 3.2.0 Preview 1:</p>
<ul>
<li>Update all Microsoft.AspNetCore.Blazor.* package references to 3.2.0-preview1.20073.1.</li>
<li>In <em>Program.cs</em> in the Blazor WebAssembly client project replace <code>BlazorWebAssemblyHost.CreateDefaultBuilder()</code> with <code>WebAssemblyHostBuilder.CreateDefault()</code>.</li>
<li>Move the root component registrations in the Blazor WebAssembly client project from <code>Startup.Configure</code> to <em>Program.cs</em> by calling <code>builder.RootComponents.Add&lt;TComponent&gt;(string selector)</code>.</li>
<li>Move the configured services in the Blazor WebAssembly client project from <code>Startup.ConfigureServices</code> to <em>Program.cs</em> by adding services to the <code>builder.Services</code> collection.</li>
<li>Remove <em>Startup.cs</em> from the Blazor WebAssembly client project.</li>
<li>If you’re hosting Blazor WebAssembly with ASP.NET Core, in your <em>Server</em> project replace the call to <code>app.UseClientSideBlazorFiles&lt;Client.Startup&gt;(...)</code> with <code>app.UseClientSideBlazorFiles&lt;Client.Program&gt;(...)</code>.</li>
</ul>
<h2>Version updated to 3.2</h2>
<p>In this release we updated the versions of the Blazor WebAssembly packages to 3.2 to distinguish them from the recent .NET Core 3.1 Long Term Support (LTS) release. There is no corresponding .NET Core 3.2 release – the new 3.2 version applies only to Blazor WebAssembly. Blazor WebAssembly is currently based on .NET Core 3.1, but it doesn’t inherit the .NET Core 3.1 LTS status. Instead, the initial release of Blazor WebAssembly scheduled for May of this year will be a <em>Current</em> release, which “are supported for three months after a subsequent Current or LTS release” as described in the <a href="https://dotnet.microsoft.com/platform/support/policy/dotnet-core">.NET Core support policy</a>. The next planned release for Blazor WebAssembly after the 3.2 release in May will be with <a href="https://devblogs.microsoft.com/dotnet/introducing-net-5/">.NET 5</a>. This means that once .NET 5 ships you’ll need to update your Blazor WebAssembly apps to .NET 5 to stay in support.</p>
<h2>Simplified startup</h2>
<p>We’ve simplified the startup and hosting APIs for Blazor WebAssembly in this release. Originally the startup and hosting APIs for Blazor WebAssembly were designed to mirror the patterns used by ASP.NET Core, but not all of the concepts were relevant. The updated APIs also enable some new scenarios.</p>
<p>Here’s what the new startup code in <em>Program.cs</em> looks like:</p>
<pre><code class="csharp">public class Program
{ public static async Task Main(string[] args) { var builder = WebAssemblyHostBuilder.CreateDefault(args); builder.RootComponents.Add&lt;App&gt;("app"); await builder.Build().RunAsync(); }
}
</code></pre>
<p>Blazor WebAssembly apps now support async <code>Main</code> methods for the app entry point.</p>
<p>To a create a default host builder, call <code>WebAssemblyHostBuilder.CreateDefault()</code>. Root components and services are configured using the builder; a separate <code>Startup</code> class is no longer needed.</p>
<p>The following example adds a <code>WeatherService</code> so it’s available through dependency injection (DI):</p>
<pre><code class="csharp">public class Program
{ public static async Task Main(string[] args) { var builder = WebAssemblyHostBuilder.CreateDefault(args); builder.Services.AddSingleton&lt;WeatherService&gt;(); builder.RootComponents.Add&lt;App&gt;("app"); await builder.Build().RunAsync(); }
}
</code></pre>
<p>Once the host is built, you can access services from the root DI scope before any components have been rendered. This can be useful if you need to run some initialization logic before anything is rendered:</p>
<pre><code class="csharp">public class Program
{ public static async Task Main(string[] args) { var builder = WebAssemblyHostBuilder.CreateDefault(args); builder.Services.AddSingleton&lt;WeatherService&gt;(); builder.RootComponents.Add&lt;App&gt;("app"); var host = builder.Build(); var weatherService = host.Services.GetRequiredService&lt;WeatherService&gt;(); await weatherService.InitializeWeatherAsync(); await host.RunAsync(); }
}
</code></pre>
<p>The host also now provides a central configuration instance for the app. The configuration isn’t populated with any data by default, but you can populate it as required in your app.</p>
<pre><code class="csharp">public class Program
{ public static async Task Main(string[] args) { var builder = WebAssemblyHostBuilder.CreateDefault(args); builder.Services.AddSingleton&lt;WeatherService&gt;(); builder.RootComponents.Add&lt;App&gt;("app"); var host = builder.Build(); var weatherService = host.Services.GetRequiredService&lt;WeatherService&gt;(); await weatherService.InitializeWeatherAsync(host.Configuration["WeatherServiceUrl"]); await host.RunAsync(); }
}
</code></pre>
<h2>Download size improvements</h2>
<p>Blazor WebAssembly apps run the .NET IL linker on every build to trim unused code from the app. In previous releases only the core framework libraries were trimmed. Starting with this release the Blazor framework assemblies are trimmed as well resulting in a modest size reduction of about 100 KB transferred. As before, if you ever need to turn off linking, add the <code>&lt;BlazorLinkOnBuild&gt;false&lt;/BlazorLinkOnBuild&gt;</code> property to your project file.</p>
<h2>Support for the .NET SignalR client</h2>
<p>You can now use SignalR from your Blazor WebAssembly apps using the .NET SignalR client.</p>
<p>To give SignalR a try from your Blazor WebAssembly app:</p>
<ol>
<li>
<p>Create an ASP.NET Core hosted Blazor WebAssembly app.</p>
<pre><code>dotnet new blazorwasm -ho -o BlazorSignalRApp
</code></pre>
</li>
<li>
<p>Add the ASP.NET Core SignalR Client package to the <em>Client</em> project.</p>
<pre><code>cd BlazorSignalRApp
dotnet add Client package Microsoft.AspNetCore.SignalR.Client
</code></pre>
</li>
<li>
<p>In the <em>Server</em> project, add the following <em>Hub/ChatHub.cs</em> class.</p>
<pre><code class="csharp">using System.Threading.Tasks;
using Microsoft.AspNetCore.SignalR; namespace BlazorSignalRApp.Server.Hubs
{ public class ChatHub : Hub { public async Task SendMessage(string user, string message) { await Clients.All.SendAsync("ReceiveMessage", user, message); } }
}
</code></pre>
</li>
<li>
<p>In the <em>Server</em> project, add the SignalR services in the <code>Startup.ConfigureServices</code> method.</p>
<pre><code class="csharp">services.AddSignalR();
</code></pre>
</li>
<li>
<p>Also add an endpoint for the <code>ChatHub</code> in <code>Startup.Configure</code>.</p>
<pre><code class="csharp">.UseEndpoints(endpoints =&gt;
{ endpoints.MapDefaultControllerRoute(); endpoints.MapHub&lt;ChatHub&gt;("/chatHub"); endpoints.MapFallbackToClientSideBlazor&lt;Client.Program&gt;("index.html");
});
</code></pre>
</li>
<li>
<p>Update <em>Pages/Index.razor</em> in the <em>Client</em> project with the following markup.</p>
<pre><code class="razor">@using Microsoft.AspNetCore.SignalR.Client
@page "/"
@inject NavigationManager NavigationManager &lt;div&gt; &lt;label for="userInput"&gt;User:&lt;/label&gt; &lt;input id="userInput" @bind="userInput" /&gt;
&lt;/div&gt;
&lt;div class="form-group"&gt; &lt;label for="messageInput"&gt;Message:&lt;/label&gt; &lt;input id="messageInput" @bind="messageInput" /&gt;
&lt;/div&gt;
&lt;button @onclick="Send" disabled="@(!IsConnected)"&gt;Send Message&lt;/button&gt; &lt;hr /&gt; &lt;ul id="messagesList"&gt; @foreach (var message in messages) { &lt;li&gt;@message&lt;/li&gt; }
&lt;/ul&gt; @code { HubConnection hubConnection; List&lt;string&gt; messages = new List&lt;string&gt;(); string userInput; string messageInput; protected override async Task OnInitializedAsync() { hubConnection = new HubConnectionBuilder() .WithUrl(NavigationManager.ToAbsoluteUri("/chatHub")) .Build(); hubConnection.On&lt;string, string&gt;("ReceiveMessage", (user, message) =&gt; { var encodedMsg = user + " says " + message; messages.Add(encodedMsg); StateHasChanged(); }); await hubConnection.StartAsync(); } Task Send() =&gt; hubConnection.SendAsync("SendMessage", userInput, messageInput); public bool IsConnected =&gt; hubConnection.State == HubConnectionState.Connected;
}
</code></pre>
</li>
<li>
<p>Build and run the <em>Server</em> project</p>
<pre><code>cd Server
dotnet run
</code></pre>
</li>
<li>
<p>Open the app in two separate browser tabs to chat in real time over SignalR.</p>
</li>
</ol>
<h2>Known issues</h2>
<p>Below is the list of known issues with this release that will get addressed in a future update.</p>
<ul>
<li>
<p>Running a new ASP.NET Core hosted Blazor WebAssembly app from the command-line results in the warning: <code>CSC : warning CS8034: Unable to load Analyzer assembly C:\Users\user\.nuget\packages\microsoft.aspnetcore.components.analyzers\3.1.0\analyzers\dotnet\cs\Microsoft.AspNetCore.Components.Analyzers.dll : Assembly with same name is already loaded.</code></p>
<ul>
<li>Workaround: This warning can be ignored or suppressed using the <code>&lt;DisableImplicitComponentsAnalyzers&gt;true&lt;/DisableImplicitComponentsAnalyzers&gt;</code> MSBuild property.</li>
</ul>
</li>
</ul>
<h2>Feedback</h2>
<p>We hope you enjoy the new features in this preview release of Blazor WebAssembly! Please let us know what you think by filing issues on <a href="https://github.com/dotnet/aspnetcore/issues">GitHub</a>.</p>
<p>Thanks for trying out Blazor!</p>
<div class="authorinfoarea">
<div><img src="https://www.sickgaming.net/blog/wp-content/uploads/2020/01/blazor-webassembly-3-2-0-preview-1-release-now-available.jpg" width="96" height="96" alt="Daniel Roth" class="avatar avatar-96 wp-user-avatar wp-user-avatar-96 alignnone photo"></div>
<div>
<h5><a class="no-underline" aria-label="Daniel Roth is the name of the author of this post. Click to access author page." href="https://devblogs.microsoft.com/aspnet/author/danroth27/">Daniel Roth</a></h5>
<p>Principal Program Manager,&nbsp;ASP.NET</p>
<p><strong>Follow Daniel</strong>&nbsp;&nbsp;&nbsp;<a class="no-underline stayinformed" aria-label="Daniel Roth Twitter profile" target="_blank" href="https://twitter.com/danroth27" rel="noopener noreferrer"><i class="fa fa-twitter"></i></a><a class="no-underline stayinformed" aria-label="Daniel Roth GitHub profile" target="_blank" href="https://github.com/danroth27" rel="noopener noreferrer"><i class="fa fa-github"></i></a><a class="no-underline stayinformed hvr-pop" aria-label="Daniel Roth RSS Feed" target="_blank" href="https://devblogs.microsoft.com/aspnet/author/danroth27/feed/" rel="noopener noreferrer"></a></p>
</p></div>
</p></div>
</div>


https://www.sickgaming.net/blog/2020/01/...available/
Reply



Forum Jump:


Users browsing this thread:
3 Guest(s)

Forum software by © MyBB Theme © iAndrew 2016