+- Sick Gaming (https://www.sickgaming.net)
+-- Forum: Programming (https://www.sickgaming.net/forum-76.html)
+--- Forum: C#, Visual Basic, & .Net Frameworks (https://www.sickgaming.net/forum-79.html)
+--- Thread: Blazor 0.8.0 experimental release now available (/thread-88562.html)
Blazor 0.8.0 experimental release now available - xSicKxBot - 02-06-2019
Blazor 0.8.0 experimental release now available
<div style="margin: 5px 5% 10px 5%;"><img src="http://www.sickgaming.net/blog/wp-content/uploads/2019/02/blazor-0-8-0-experimental-release-now-available.png" width="1282" height="437" title="" alt="" /></div><div><p>Blazor 0.8.0 is now available! This release updates Blazor to use Razor Components in .NET Core 3.0 and adds some critical bug fixes.</p>
<h2 id="get-blazor-0-8-0">Get Blazor 0.8.0</h2>
<p>To get started with Blazor 0.8.0 install the following:</p>
<ol>
<li><a href="https://dotnet.microsoft.com/download/dotnet-core/3.0">.NET Core 3.0 Preview 2 SDK</a> (3.0.100-preview-010184)</li>
<li><a href="https://visualstudio.com/preview">Visual Studio 2019</a> (Preview 2 or later) with the <em>ASP.NET and web development</em> workload selected.</li>
<li>The latest <a href="https://go.microsoft.com/fwlink/?linkid=870389">Blazor</a> extension from the Visual Studio Marketplace.</li>
<li>
<p>The Blazor templates on the command-line:</p>
<pre><code>dotnet new -<span class="hljs-selector-tag">i</span> Microsoft<span class="hljs-selector-class">.AspNetCore</span><span class="hljs-selector-class">.Blazor</span><span class="hljs-selector-class">.Templates</span>::<span class="hljs-number">0.8</span>.<span class="hljs-number">0</span>-preview-<span class="hljs-number">19104</span>-<span class="hljs-number">04</span>
</code></pre>
</li>
</ol>
<p>You can find getting started instructions, docs, and tutorials for Blazor at <a href="https://blazor.net">https://blazor.net</a>.</p>
<h2 id="upgrade-to-blazor-0-8-0">Upgrade to Blazor 0.8.0</h2>
<p>To upgrade your existing Blazor apps to Blazor 0.8.0 first make sure you’ve installed the prerequisites listed above.</p>
<p>To upgrade a standalone Blazor 0.7.0 project to 0.8.0:</p>
<ul>
<li>Update the Blazor packages and .NET CLI tool references to 0.8.0-preview-19104-04.</li>
<li>Replace any package reference to Microsoft.AspNetCore.Blazor.Browser with a reference to Microsoft.AspNetCore.Blazor.</li>
<li>Replace <code>BlazorComponent</code> with <code>ComponentBase</code>.</li>
<li>Update overrides of <code>SetParameters</code> on components to override <code>SetParametersAsync</code> instead.</li>
<li>Replace <code>BlazorLayoutComponent</code> with <code>LayoutComponentBase</code></li>
<li>Replace <code>IBlazorApplicationBuilder</code> with <code>IComponentsApplicationBuilder</code>.</li>
<li>Replace any using statements for <code>Microsoft.AspNetCore.Blazor.*</code> with <code>Microsoft.AspNetCore.Components.*</code>, except leave <code>Microsoft.AspNetCore.Blazor.Hosting</code> in <em>Program.cs</em></li>
<li>In <em>index.html</em> update the script reference to reference <em>components.webassembly.js</em> instead of <em>blazor.webassembly.js</em></li>
</ul>
<p>To upgrade an ASP.NET Core hosted Blazor app to 0.8.0:</p>
<ul>
<li>Update the client-side Blazor project as described previously.</li>
<li>Update the ASP.NET Core app hosting the Blazor app to .NET Core 3.0 by following the <a href="https://docs.microsoft.com/en-us/aspnet/core/migration/22-to-30">migrations steps in the ASP.NET Core docs</a>.
<ul>
<li>Update the target framework to be <code>netcoreapp3.0</code></li>
<li>Remove any package reference to Microsoft.AspNetCore.App or Microsoft.AspNetCore.All</li>
<li>Upgrade any non-Blazor Microsoft.AspNetCore.* package references to version 3.0.0-preview-19075-0444</li>
<li>Remove any package reference to Microsoft.AspNetCore.Razor.Design</li>
<li>To enable JSON support, add a package reference to Microsoft.AspNetCore.Mvc.NewtonsoftJson and update<code>Startup.ConfigureServices</code> to call <code>services.AddMvc().AddNewtonsoftJson()</code></li>
</ul>
</li>
<li>Upgrade the Microsoft.AspNetCore.Blazor.Server package reference to 0.8.0-preview-19104-04</li>
<li>Add a package reference to Microsoft.AspNetCore.Components.Server</li>
<li>In <code>Startup.ConfigureServices</code> simplify any call to <code>app.AddResponseCompression</code> to call the default overload without specifying WebAssembly or binary data as additional MIME types to compress.</li>
<li>In <code>Startup.Configure</code> add a call to <code>app.UseBlazorDebugging()</code> after the existing call to <code>app.UseBlazor<App.Startup>()</code></li>
<li>Remove any unnecessary use of the <code>Microsoft.AspNetCore.Blazor.Server</code> namespace.</li>
</ul>
<p>To upgrade a Blazor class library to 0.8.0:</p>
<ul>
<li>Replace the package references to Microsoft.AspNetCore.Blazor.Browser and Microsoft.AspNetCore.Blazor.Build with references to Microsoft.AspNetCore.Components.Browser and Microsoft.AspNetCore.Components.Build and update the versions to 3.0.0-preview-19075-0444.</li>
<li>In the project file for the library change the project SDK from “Microsoft.NET.Sdk.Web” to “Microsoft.NET.Sdk.Razor”.</li>
</ul>
<h2 id="server-side-blazor-is-now-asp-net-core-razor-components-in-net-core-3-0">Server-side Blazor is now ASP.NET Core Razor Components in .NET Core 3.0</h2>
<p>As was recently <a href="https://blogs.msdn.microsoft.com/webdev/2019/01/29/aspnet-core-3-preview-2/">announced</a>, server-side Blazor is now shipping as ASP.NET Core Razor Components in .NET Core 3.0. We’ve integrated the Blazor component model into ASP.NET Core 3.0 and renamed it to Razor Components. Blazor 0.8.0 is now built on Razor Components and enables you to host Razor Components in the browser on WebAssembly.</p>
<h3 id="upgrade-a-server-side-blazor-project-to-asp-net-core-razor-components-in-net-core-3-0">Upgrade a server-side Blazor project to ASP.NET Core Razor Components in .NET Core 3.0</h3>
<p>If you’ve been working with server-side Blazor, we recommend upgrading to use ASP.NET Core Razor Components in .NET Core 3.0.</p>
<p>To upgrade a server-side Blazor app to ASP.NET Core Razor Components:</p>
<ul>
<li>Update the client-side Blazor project as described previously, except replace the script reference to <em>blazor.server.js</em> with <em>components.server.js</em></li>
<li>Update the ASP.NET Core app hosting the Razor Components to .NET Core 3.0 as described previously.</li>
<li>In the server project:
<ul>
<li>Upgrade the Microsoft.AspNetCore.Blazor.Server package reference to 0.8.0-preview-19104-04</li>
<li>Add a package reference to Microsoft.AspNetCore.Components.Server version 3.0.0-preview-19075-0444</li>
<li>Replace the using statement for <code>Microsoft.AspNetCore.Blazor.Server</code> with <code>Microsoft.AspNetCore.Components.Server</code></li>
<li>Replace <code>services.AddServerSideBlazor</code> with <code>services.AddRazorComponents</code> and <code>app.UseServerSideBlazor</code> with <code>app.UseRazorComponents</code>.</li>
<li>In the <code>Startup.Configure</code> method add <code>app.UseStaticFiles()</code> just prior to calling <code>app.UseRazorComponents</code>.</li>
<li>Move the <em>wwwroot</em> folder from the Blazor app project to the ASP.NET Core server project</li>
</ul>
</li>
</ul>
<h3 id="switching-between-asp-net-core-razor-components-and-client-side-blazor">Switching between ASP.NET Core Razor Components and client-side Blazor</h3>
<p>Sometimes it’s convenient to be able to switch between running your Razor Components on the server (ASP.NET Core Razor Components) and on the client (Blazor). For example, you might run on the server during development so that you can easily debug, but then publish your app to run on the client.</p>
<p>To update an ASP.NET Core hosted Blazor app so that it can be run as an ASP.NET Core Razor Components app:</p>
<ul>
<li>Move the <em>wwwroot</em> folder from the client-side Blazor project to the ASP.NET Core server project.</li>
<li>In the server project:
<ul>
<li>Update the script tag in <em>index.html</em> to point to <em>components.server.js</em> instead of <em>components.webassembly.js</em>.</li>
<li>Add a call to <code>services.AddRazorComponents<Client.Startup>()</code> in the <code>Startup.ConfigureServices</code> method.</li>
<li>Add a call to <code>app.UseStaticFiles()</code> in the <code>Startup.Configure</code> method prior to the call to <code>UseMvc</code>.</li>
<li>Replace the call to <code>UseBlazor</code> with <code>app.UseRazorComponents<Client.Startup>()</code></li>
</ul>
</li>
<li>If you’re using dependency injection to inject an <code>HttpClient</code> into your components, then you’ll need to add an <code>HttpClient</code> as a service in your server’s <code>Startup.ConfigureServices</code> method.</li>
</ul>
<p>Previously to get tooling support for Blazor projects you needed to install the Blazor extension for Visual Studio. Starting with Visual Studio 2019 Preview 2, tooling support for Razor Components (and hence Blazor apps) is already included without having to install anything else. The Blazor extension is now only needed to install the Blazor project templates in Visual Studio.</p>
<h2 id="runtime-improvements">Runtime improvements</h2>
<p>Blazor 0.8.0 includes some .NET runtime improvements like improved runtime performance on Chrome and an improved IL linker. In our performance benchmarks, Blazor 0.8.0 performance on Chrome is now about 25% faster. You can now also reference existing libraries like Json.NET from a Blazor app without any additional linker configuration:</p>
<pre><code class="lang-csharp">@functions { WeatherForecast[] forecasts;
<span class="hljs-function"><span class="hljs-keyword">protected</span> <span class="hljs-keyword">override</span> <span class="hljs-keyword">async</span> Task <span class="hljs-title">OnInitAsync</span>(<span class="hljs-params" />) </span>{ <span class="hljs-keyword">var</span> json = <span class="hljs-keyword">await</span> Http.GetStringAsync(<span class="hljs-string">"api/SampleData/WeatherForecasts"</span>); forecasts = Newtonsoft.Json.JsonConvert.DeserializeObject<WeatherForecast[]>(json); }
}
</code></pre>
<h2 id="known-issues">Known issues</h2>
<p>There are a couple of known issues with this release that you may run into:</p>
<ul>
<li><strong>“It was not possible to find any compatible framework version. The specified framework ‘Microsoft.NETCore.App’, version ‘2.0.0’ was not found.”</strong>: You may see this error when building a Blazor app because the IL linker currently requires .NET Core 2.x to run. To work around this issue, either install <a href="https://dotnet.microsoft.com/download/dotnet-core/2.2">.NET Core 2.2</a> or disable IL linking by setting the <code><BlazorLinkOnBuild>false</BlazorLinkOnBuild></code> property in your project file.</li>
<li><strong>“Unable to generate deps.json, it may have been already generated.”</strong>: You may see this error when running a standalone Blazor app and you haven’t yet restored packages for any .NET Core apps. To workaround this issue create any .NET Core app (ex <code>dotnet new console</code>) and then rerun the Blazor app.</li>
</ul>
<p>These issues will be addressed in a future Blazor update.</p>
<h2 id="future-updates">Future updates</h2>
<p>This release of Blazor was primarily focused on first integrating Razor Components into ASP.NET Core 3.0 and then rebuilding Blazor on top of that. Going forward, we plan to ship Blazor updates with each .NET Core 3.0 update. </p>
<p>Blazor, and support for running Razor Components on WebAssembly in the browser, won’t ship with .NET Core 3.0, but we continue to work towards shipping Blazor some later date.</p>
<h2 id="give-feedback">Give feedback</h2>
<p>We hope you enjoy this latest preview release of Blazor. As with previous releases, your feedback is important to us. If you run into issues or have questions while trying out Blazor, <a href="https://github.com/aspnet/aspnetcore/issues">file issues on GitHub</a>. You can also chat with us and the Blazor community on <a href="https://gitter.im/aspnet/blazor">Gitter</a> if you get stuck or to share how Blazor is working for you. After you’ve tried out Blazor for a while please let us know what you think by taking our in-product survey. Click the survey link shown on the app home page when running one of the Blazor project templates:</p>
<p><img src="http://www.sickgaming.net/blog/wp-content/uploads/2019/02/blazor-0-8-0-experimental-release-now-available.png" alt="Blazor survey" /></p>
<p>Thanks for trying out Blazor!</p>
<p> </p>
</div>