Server Blazor如何使用Razor类库提供的捆绑作用域CSS文件？

内置自动加载逻辑（直接引用RCL场景） #

• .NET 5 对Razor类库（RCL）的CSS隔离引入了自动加载优化，这也是和.NET Core 3.X版本最明显的差异：.NET Core 3.X需要手动在head中添加每个RCL的CSS link标签，.NET 5及以上版本会在构建时自动生成主项目的{主项目名}.styles.css文件，内部通过@import语句引入所有直接引用RCL的/_content/{RCL名称}/{RCL名称}.bundle.scp.css资源，你只要在_host.cshtml的head中引入这一个全局样式文件即可。
• 开发阶段的文件映射：主项目的wwwroot下不会生成物理的_content文件夹，框架内置的静态资源中间件会自动将/_content/开头的请求，路由到对应RCL编译后生成在obj/{编译配置}/net5.0/scopedcss/bundle/目录下的临时CSS文件，不需要额外配置。
• 发布阶段的逻辑：发布时框架会自动把所有直接引用RCL的CSS隔离捆绑文件提取到主项目发布产物的wwwroot/_content/目录下，同时生成最终的全局样式文件，路径规则和开发阶段完全一致，不需要额外调整。

动态加载RCL场景的方案评估 #

你当前手动从RCL的obj目录复制文件、额外配置静态文件目录的临时方案，存在以下几个明显的潜在问题：

• obj目录是编译临时产物目录，每次RCL重新编译都可能出现文件覆盖、目录结构变更的情况，手动复制容易出现样式版本不匹配的问题
• 额外配置静态文件目录容易和框架内置的/_content路由规则冲突，发布阶段还需要额外维护文件复制逻辑，维护成本很高
• 手动添加link标签无法保证和官方加载顺序一致，容易出现样式优先级错误、覆盖异常的问题

更合理的实现方案 #

完全不需要手动复制临时文件，也不需要额外配置静态文件目录，可以完全对齐官方直接引用的行为：

1. 保留框架默认的app.UseStaticFiles()配置即可，不需要新增静态资源目录。只要你能获取到动态加载RCL的程序集名称，直接拼接路径/_content/{RCL程序集名}/{RCL程序集名}.bundle.scp.css，在_host.cshtml的head部分动态插入对应的link标签，或者将该路径作为@import语句插入到全局{主项目名}.styles.css的末尾即可，和官方加载逻辑完全一致。
2. 如果你需要按需加载，不需要全局引入样式，可以在动态加载RCL对应的页面组件初始化时，通过JS互操作动态插入对应CSS的link标签，避免加载无用样式占用带宽。
3. 发布阶段只需要将每个动态加载RCL发布产物里的wwwroot/_content/{RCL名称}目录，复制到主项目发布后的wwwroot/_content目录下即可，也可以在CI/CD流程中添加自动复制脚本，不需要手动处理。

常见疑问说明 #

• 样式的引入时机：全局引入还是按需加载完全取决于业务场景，如果RCL是全局通用的组件库，直接全局引入即可；如果是只有特定业务页面才会用到的RCL，按需加载的性能表现更好。
• 手动创建_content目录的风险：只要你保证目录结构、文件名和RCL编译生成的规则一致，不会有功能层面的问题，但需要注意如果目录下存在和直接引用RCL重名的文件，发布时会被框架自动生成的文件覆盖，非动态加载的RCL不要手动维护该目录。

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