blazor - 启用 RCL 的 CSS 隔离以在 Blazor 服务器中工作

Question

我有一个 razor 类库和使用这个库的 blazor 服务器，RCL 中的每个组件都有自己的 css，在阅读微软的文档后 ASP.NET Core Blazor CSS isolation我做了以下事情:

1. 在 blazor 服务器的 razor 页面中，我添加了我的组件:<MyComponent />
2. 在 _Host 页面中，我添加了捆绑链接:<link href="Blazor.Components.styles.css" rel="stylesheet"> .

运行应用程序后，我看不到 MyComponent 的 css。

我做错了什么吗？你能给我一些建议吗？我读了这个page遵循相同的方法，但用于 Webassembly!

谢谢。

Answer 1

引用 Razor class library (RCL) support文档:

When a Razor class library (RCL) provides isolated styles, the tag's href attribute points to {STATIC WEB ASSET BASE PATH}/{ASSEMBLY NAME}.bundle.scp.css, where the placeholders are:

• {STATIC WEB ASSET BASE PATH}: The static web asset base path.
• {ASSEMBLY NAME}: The class library's assembly name.

In the following example:

• The static web asset base path is _content/ClassLib.
• The class library's assembly name is ClassLib.

<link href="_content/ClassLib/ClassLib.bundle.scp.css" rel="stylesheet">

在 _Host 页面中，您应该添加如下内容:

<link href="_content/YourClassLib/YourClassLib.bundle.scp.css" rel="stylesheet">