Необнаруженные ошибки сборки в Blazor, возможно, связанные с изоляцией CSS. ⇐ C#

[Anonymous]

Предпосылка
Я работаю над проектом Blazor на .NET 8.0, пишу для Visual Studio Community 2026 v. 18.3.0, с InteractiveServer в качестве режима рендеринга для всего решения по умолчанию.
Мои искренние извинения за сомнительное форматирование и длину, поскольку я не совсем уверен, с чем имею дело.
цель
Я создаю псевдомодальное окно, следуя этому руководству:
https://amarozka.dev/blazor-custom-modal-compent/
Я собираюсь настроить компонент, отредактировав соответствующий файл .css.
Проблема
После создания связанного Modal.razor.css файл и поместив его в ту же папку, что и компонент Modal.razor, я получаю ошибку сборки, но никакая ошибка не обнаруживается и не отображается в IDE.

Попытки исправления
Я пробовал перемещение файлов .razor.css во вновь созданную папку wwwroot/css, но это привело только к ошибке для каждого файла .css из-за ошибочного размещения (поскольку они должны находиться в той же папке, что и связанный компонент .razor).
Я прочитал некоторую документацию по этому вопросу:
https://learn.microsoft.com/en-us/aspne ... etcore-8.0
Но я не могу найти решение; Я не менял фундаментально структуру проекта по умолчанию (см. ниже), и та же самая конфигурация, кажется, работает нормально для базового компонента MainLayout.razor.
Есть несколько сообщений SO, близких к этой теме:
CSS-изоляция в компонентах blazor-server
Это относится к гораздо более старой версии Blazor, чем та, с которой я работаю, и, по-видимому, относится к структуре проекта. это сильно отличается от моего.
Изоляция CSS в Blazor
Этот вопрос также находится на более старой стороне и тоже не решен.
Компонент Razor не распознает файл .razor.css в проекте Blazor
Этот вопрос выглядит наиболее близким к моей проблеме, но я не могу дойти до принятого ответа, потому что программа даже не собирается, несмотря на показ Ошибок: 0.
Код
Вот компонент Modal.razor:

Код: Выделить всё

    @if (IsVisible)
{


@Title

@ChildContent


@if (!isError)
{

@ButtonConfirm

}

@ButtonDismiss



}

@code {
[Parameter]
public bool IsVisible { get; set; }
[Parameter]
public string Title { get; set; } = "";
[Parameter]
public RenderFragment ChildContent { get; set; }
[Parameter]
public bool isError { get; set; } = false;
[Parameter]
public string ButtonConfirm { get; set; }
[Parameter]
public string ButtonDismiss { get; set; }
[Parameter]
public EventCallback OnConfirm { get; set; }
[Parameter]
public EventCallback OnDismiss { get; set; }

public async Task ModalConfirm()
{
await OnConfirm.InvokeAsync();
}

public async Task ModalDismiss()
{
await OnDismiss.InvokeAsync();
}
}

Вот файл Modal.razor.css:

Код: Выделить всё

.modal-overlay {
position: fixed;
top: 0;
left: 0;
right: 0;
bottom: 0;
display: flex;
align-items: center;
justify-content: center;
z-index: 1000;
}

.modal-container {
background: white;
padding: 1.5rem;
border-radius: 10px;
min-width: 300px;
opacity: 0;
transform: scale(0.9);
transition: all 0.3s ease;
}

.modal-overlay.show .modal-container {
opacity: 1;
transform: scale(1);
}

Чтобы провести сравнение с чем-то, что работает должным образом, вот компонент MainLayout.razor:

Код: Выделить всё

@inherits LayoutComponentBase


[*]




[/i]



@Body




@code {
public void GoHome()
{
NavigationManager.NavigateTo("/");
}
}

Вот положение файлов в проекте:


Вопросы

• Почему нет Modal.razor.css работает так, как задумано?
• Почему Visual Studio не обнаруживает ничего неправильного?

РЕДАКТИРОВАТЬ
После очистки кеша браузера (Chrome 144.0.7559.135) проект собирается, но

• Теперь отображается ложная ошибка
  
• Редактирование Modal.razor.css, похоже, не влияет на представление модального окна (я пробовал установить красный цвет фона, но ничего не произошло изменено)

Подробнее здесь: https://stackoverflow.com/questions/798 ... -isolation