共享 CSS 文件 blazor

Question

我的 Blazor 應用程序中有 2 頁工作：

Auth文件夾中的Login.razor

配置文件文件夾中的AddPerson.razor

現在我有一個適用於 AddPerson.razor 文件的 CSS 文件。

我的問題是如何為兩個頁面使用相同的 CSS 文件？

Answer 1

The strengths of the new .NET5 CSS isolation feature (placing a css file "below" your razor file), is that the css is NOT shared between pages/components making them easier to develop and contained/bundled to the specific component.

但是，如果您想添加一些可通過您的應用程序使用的共享 css，您可以通過編輯站點范圍的 css 文件來“以舊方式”進行操作。 使用 Blazor 模板，即wwwroot/css/site.css用於服務器端或wwwroot/css/app.css用於客戶端。

Answer 2

遲到的替代答案對不起。 我安裝了“Web 編譯器”擴展。 您可以創建一個.scss 文件，該文件導入另一個方便的定義等。

MessageView.razor.scss

@import "common.scss";

.bubble {
    border-radius: 5px;
    box-shadow: $bubbleShadow; 
...