.NET 8 Blazor WASM全局模式下如何设置启动屏？

.NET 8的Blazor Web App（全局WASM模式）不再使用独立的index.html，取而代之的是Server项目下的Pages/_Host.cshtml作为宿主页面，你可以按以下方式配置启动屏：

1. 打开Server项目里的Pages/_Host.cshtml文件
2. 找到页面中的<component>标签（格式通常为<component type="typeof(App)" render-mode="WebAssembly" />），把你之前的启动屏内容放在这个标签的位置上方，最终结构如下：

<body>
    <div id="app">
        <div style="width: 100%">
            <div class="p-5 bg-light border rounded-3 marginTop20px marginLeft20px marginRight20px mb-3">
                <h2>请等待应用加载...</h2>
            </div>
        </div>
    </div>

    <component type="typeof(App)" render-mode="WebAssembly" />

    <div id="blazor-error-ui">
        发生未处理的错误。
        <a href="" class="reload">重新加载</a>
        <a class="dismiss">🗙</a>
    </div>

    <script src="_framework/blazor.webassembly.js"></script>
</body>

3. 保存文件后启动项目，当Blazor WASM应用加载完成时，组件内容会自动替换掉启动屏的DOM元素。

注意：如果你的启动屏使用了自定义CSS类（比如marginTop20px），需要将对应的样式规则添加到项目的全局样式文件中（比如Client项目wwwroot/css/app.css）。

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