能否在.NET 4.7版本MVC应用中嵌入Blazor WASM组件且无需全量升级

1. 直接嵌入Blazor WASM组件的可行性 #

完全可以实现，不需要将现有.NET 4.7 MVC项目全量升级到.NET 5+版本。
Blazor WASM是运行在浏览器端的WebAssembly应用，和后端服务的框架版本没有耦合，你只需要独立维护Blazor WASM项目，再把编译产物接入现有MVC项目即可：

• 单独创建任意.NET 6+版本的Blazor WASM项目，开发你需要的组件，这个项目和现有.NET 4.7 MVC项目完全独立
• 编译Blazor WASM项目后，将输出的_framework文件夹以及相关静态资源拷贝到MVC项目的静态资源目录
• 在需要嵌入组件的MVC视图页中引入Blazor启动脚本：<script src="_framework/blazor.webassembly.js"></script>
• 在视图对应位置直接插入Blazor组件的根元素标签即可正常渲染

如果Blazor组件需要调用现有MVC项目的接口，仅需给MVC项目配置对应CORS规则即可，无需其他修改。

2. Blazor WASM自定义元素导出能力 #

支持和Angular自定义元素等价的能力，导出的组件是符合W3C标准的Web Components，可以在任意前端环境直接使用，同样不需要修改现有MVC项目的框架版本：

• 在Blazor WASM项目中安装官方包Microsoft.AspNetCore.Components.CustomElements
• 在项目的Program.cs中注册需要导出的组件，示例代码：

builder.RootComponents.RegisterCustomElement<YourCustomComponent>("my-blazor-component");

• 编译后即可在MVC视图、甚至其他前端框架的页面中直接用自定义标签调用组件，和普通HTML标签用法完全一致：

<my-blazor-component title="测试标题" count="10"></my-blazor-component>

导出的组件支持原生的属性绑定、事件触发能力，完全符合Web Components规范。

补充注意：Blazor WASM首次加载会有运行时包下载开销，可通过开启AOT编译、IL裁剪等方式缩小包体积，所有优化操作都在独立的Blazor WASM项目中完成，对现有老项目无侵入。

内容的提问来源于stack exchange，提问作者AJ_