Blazor WebAssembly 候选版迁移手记
前言
之前我写过一篇关于 Blazor WebAssembly 的文章浏览器中的 .Net Core —— Blazor WebAssembly 初体验,如今已经更新到 RC-1,与预览版有着较大的差异,为此补充这篇文章。
正文
与预览版的主要差异
1、这次的候选版修改了大部分包名和命名空间,因此无法通过更新包完成升级。你会发现老包一直停留在预览版。因此需要删除弃用的包,安装新的包。
2、Startup 的配置方式发生了较大变化,弱化了 Blazor 的存在感。
3、这次更新后支持在 VS 2019 调试 Blazor WebAssembly 了。当然也可以使用浏览器进行调试,效果一样。但是浏览器调试同样依赖 Blazor 远程调试代理,所以还不如直接使用 VS 调试。要求 VS 2019 16.6.0 以上版本,并进行相应配置。
4、候选版会将 Blazor 客户端的所有文件发布到宿主项目的 wwwroot 文件夹,而预览版会在宿主项目的根目录生成一个与客户端项目同名的文件夹存放发布文件。因此需要特别注意宿主项目和客户端项目的 wwwroot 文件夹不能有重名文件。
5、候选版发布时会同时生成 gzip 和 br 格式的预压缩文件,压缩效果较好,一般能压缩到原始 dll 的 1/4 大小。发布时会自动使用 IL Linker 裁剪 dll,如果使用了反射代码,可能导致运行异常,需要编写配置文件配置 Linker 的行为或禁用裁剪。如果 Linker 直接报错建议禁用。
迁移步骤
1、如果之前安装过预览版的请参考微软官方文档更新项目模板。避免新建项目停留在老版本要手动升级。
2、更新 VS 2019 到 16.6.0 以上版本。
3、在客户端和宿主服务端项目的 launchSettings.json 中增加配置项:"inspectUri": "{wsProtocol}://{url.hostname}:{url.port}/_framework/debug/ws-proxy?browser={browserInspectUri}", ,启用 VS 调试。

4、更新客户端项目文件,包括包引用和 Linker 配置。


5、更新宿主项目文件。

6、修改宿主项目的 Startup.cs 文件


注意:上图的新的注册代码推荐和 app.UseStaticFiles(); 放到一起。

上图为路由端点注册。
以上修改全部在 Configure 方法中完成。
7、修复命名空间引用和其他可自动修复的小编译错误。
至此,就完成了从预览版到候选版的迁移。在我的项目中,由于新版的发布机制,将 index.html 也一并移到 wwwroot/blazor 文件夹中,避免引起歧义。
注意事项
HttpClient 的使用方式有变更,引用的包也有区别,GetJsonAsync 换成了 GetFromJsonAsync。
调试体验
按照一般流程启动宿主项目就可以调试客户端代码了,感觉和调试一般 C# 程序没有任何区别。如果想在浏览器进行调试,同样要调试启动宿主项目,因为需要借助远程调试代理才能正常工作。需要确保 app.UseWebAssemblyDebugging(); 这句代码已经加入 Configure 方法,然后 F12 打开控制台,按照提示按组合键启动调试页面。调试页面会显示一个命令,将上述命令用 cmd 或 Win+R 执行就可以在新窗口打开调试页面。注意,新打开的页面无法触发 VS 的断点,只能触发浏览器中的断点。变量监控什么的也都能用,不过感觉也就图个新鲜,实际上也不怎么好用,需要打开两个标签,一个用来操作,一个用原来调试源码,感觉在脱裤子放屁。
注意,需要最低 Chrome 70 或 Edge 80 才能用浏览器调试功能。
结语
这次更新保持了微软改名部的一贯风格和强大友好的一条龙开发服务体验,用起来还是很舒服的。
转载请完整保留以下内容并在显眼位置标注,未经授权删除以下内容进行转载盗用的,保留追究法律责任的权利!
本文地址:https://www.cnblogs.com/coredx/p/12966150.html
完整源代码:Github
里面有各种小东西,这只是其中之一,不嫌弃的话可以Star一下。
Blazor WebAssembly 候选版迁移手记的更多相关文章
- 浏览器中的 .Net Core —— Blazor WebAssembly 初体验
前言 在两年多以前就听闻 Blazor 框架,是 .Net 之父的业余实验性项目,其目的是探索 .Net 与 WebAssembly 的兼容性和应用前景.现在这个项目已经正式成为 Asp.Net Co ...
- Blazor(WebAssembly) + .NETCore 实现斗地主
之前群里大神发了一个 html5+ .NETCore的斗地主,刚好在看Blazor WebAssembly 就尝试重写试试. 还有就是有些标题党了,因为文章里几乎没有斗地主的相关实现:),这里主要介绍 ...
- 使用WebApi和Asp.Net Core Identity 认证 Blazor WebAssembly(Blazor客户端应用)
原文:https://chrissainty.com/securing-your-blazor-apps-authentication-with-clientside-blazor-using-web ...
- Blazor WebAssembly 3.2.0 正式起飞,blazor 适合你吗?
最近blazor更新很快,今天在官方博客上发布了Blazor WebAssembly 3.2.0 RC:https://devblogs.microsoft.com/aspnet/blazor-web ...
- ASP.NET Core Blazor 初探之 Blazor WebAssembly
最近Blazor热度很高,传说马上就要发布正式版了,做为微软脑残粉,赶紧也来凑个热闹,学习一下. Blazor Blazor是微软在ASP.NET Core框架下开发的一种全新的Web开发框架.Bla ...
- Blazor WebAssembly 3.2 正式发布
5月 20日,微软 发布了 Blazor WebAssembly 3.2(https://devblogs.microsoft.com/aspnet/blazor-webassembly-3-2-0- ...
- ASP.NET Core Blazor Webassembly 之 组件
关于组件 现在前端几大轮子全面组件化.组件让我们可以对常用的功能进行封装,以便复用.组件这东西对于搞.NET的同学其实并不陌生,以前ASP.NET WebForm的用户控件其实也是一种组件.它封装ht ...
- 初尝 Blazor WebAssembly
一. 前言 Blazor 的整体介绍以及特点与优势,建议翻阅 Blazor 介绍. Blazor 是一个可是使用 .NET/C# 来编写交互式客户端的 Web UI 框架,在官网有一句话概括 &quo ...
- 一起学Blazor WebAssembly 开发(1)
最近blazor的WebAssembly 正式版出来了,正好手头有一个项目采用的前后端分离模式做的,后端用的abp vnext(.net core 的一个很著名的框架)框架开发的,其实前端之前考虑的使 ...
随机推荐
- NodeJs mysql 开启事务
如题:node后台使用mysql数据库,并使用事务来管理数据库操作. 这里主要讲一个事务的封装并写了一个INSERT 插入操作. code: 基础code: db.config.js const my ...
- OpenRASP管理后台安装记录
OpenRASP项目地址https://rasp.baidu.com/ 一.安装java 在CentOS中安装ElasticSearch需要Java1.8.0,可执行命令java -version查看 ...
- Code force-CodeCraft-20 (Div. 2) D. Nash Matrix 详解(DFS构造)
D. Nash Matrix time limit per test2 seconds memory limit per test256 megabytes inputstandard input o ...
- Codeforce-Ozon Tech Challenge 2020-A. Kuroni and the Gifts
the i-th necklace has a brightness ai, where all the ai are pairwise distinct (i.e. all ai are diffe ...
- shell之路 shell核心语法【第一篇】shell初识
shell简介 1.Shell是Unix的脚本语言,是与 Unix/Linux 交互的工具,shell使用的熟练程度反映了用户对Unix/Linux使用的熟练程度 2.Shell是系统命令+程序逻辑的 ...
- Java——深入理解Java异常体系
该系列博文会告诉你如何从入门到进阶,一步步地学习Java基础知识,并上手进行实战,接着了解每个Java知识点背后的实现原理,更完整地了解整个Java技术体系,形成自己的知识框架. 前言: Java的基 ...
- 2-JVM内存模型
内存模型 方法区 JDK1.7 之前包含1.7 将方法区称为 Perm Space 永久代 JDK1.8之后包含1.8 将方法区称为 MetaSpace 元空间. 堆(分配内存会大一些) 分配对象.n ...
- hdu1074之状压dp
#include <iostream> #include <cstdio> #include <cstring> using namespace std; cons ...
- 【Linux】1 创建目录:mkdir
mkdir命令用于创建目录,如同一路径下创建单个或多个目录.递归创建目录,但同路径下不能创建同名目录,且目录名区分大小写. [命令] mkdir [用途] 创建目录(单个目录/多个目录) [语法] m ...
- 数据结构之栈(stack)的实现
一.栈 1.定义 栈的英文为(stack),是一种数据结构 栈是一个先入后出(FILO-First In Last Out)的有序列表. 栈(stack)是限制线性表中元素的插入和删除只能在线性表的同 ...