Страницы ASP.NET Core 8.0 Razor: перезапись _Layout.cshtml.css => {application}.styles.css не найдено (404)
После создания нового проекта .NET8.0 Razor Pages (ASP.NET Core) я удалил библиотеки JQuery и Bootstrap. Затем я отредактировал _Layout.cshtml.css. При запуске проекта мои CSS-правила не применяются, поскольку мой браузер не может загрузить таблицу стилей. В результате браузер получает ошибку 404 при запросе {application}.styles.css.
Кто-нибудь знает, в чем проблема?
_Layout.cshtml и _Layout.cshtml.css выглядят следующим образом:
:root {
}
@font-face {
font-family: "Inter";
src: url(/fonts/Inter/Inter-VariableFont_slnt\,wght.ttf);
}
@font-face {
font-family: "Cutive Mono";
src: url(/fonts/Cutive_Mono/CutiveMono-Regular.ttf);
}
html {
font-family: Inter;
box-sizing: border-box;
}
body {
height: 100vh;
width: 100vw;
margin: 0;
display: grid;
grid-template-rows: 4.4rem 1fr 1.5rem;
}
header {
display: grid;
grid-template-rows: 1fr 1.5rem;
}
.main-header {
background-color: blue;
}
.main-nav {
background-color: black;
color: white;
display: flex;
align-items: center;
}
.main-nav-item {
margin-left: 0.2rem;
color: inherit;
text-decoration: inherit;
}<!DOCTYPE html>
<html lang = "de-de">
<head>
<meta charset = "utf-8" />
<meta name = "viewport" content = "width=device-width, initial-scale=1.0" />
<title>@ViewData["Title"]</title>
<link rel = "stylesheet" href = "~/css/site.css" asp-append-version = "true" />
<link rel = "stylesheet" href = "~/{application}.styles.css" asp-append-version = "true" />
</head>
<body>
<header>
<div class = "main-header"></div>
<nav class = "main-nav">
<a href = "#" class = "main-nav-item">Link 1</a>
<a href = "#" class = "main-nav-item">Link 2</a>
</nav>
</header>
<main>
@RenderBody()
</main>
<footer>
</footer>
<script src = "~/js/site.js" asp-append-version = "true"></script>
@await RenderSectionAsync("Scripts", required: false)
</body>
</html>wwwroot выглядит так:
Я обнаружил, что этот файл создается во время сборки путем сбора и изменения нескольких .css-файлов (каждый из которых привязан к странице бритвы по соглашению об именах) (= изоляция CSS). В моем случае он, похоже, не генерируется, и причина пока не найдена...
Ответы 2
Я создал новое приложение MVC на своей стороне и, как и вы, удалил из проекта библиотеки начальной загрузки и jquery, а затем прокомментировал ссылку на эти библиотеки в _Layout.cshtml. Затем я создал Index.cshtml.css и использовал его в своем Index.cshtml, у меня это сработало.
Я также проверяю комментарий <link rel = "stylesheet" href = "~/WebApplication2.styles.css" asp-append-version = "true" />, тогда мой собственный стиль не будет использоваться, но поскольку он не ссылается на ApplicationName.stype.css, чтобы я не получил ошибку 404. То же самое и в новом веб-приложении .net 8 razor. Боюсь, вы могли бы очистить и пересобрать свое приложение, а также проверить, есть ли у вас <link rel = "stylesheet" href = "~/WebApplication2.styles.css" asp-append-version = "true" /> в вашем _layout.cshtml.
Если это не поможет решить вашу проблему, не могли бы вы поделиться минимальным образцом для воспроизведения проблемы?
Я нашел проблему, как описано в моем ответе. Спасибо, в любом случае!
Я нашел проблему:
При создании проекта My Project.csproj создается пространство имен My_Project (с подчеркиванием).
Я использовал пространство имен для пути к файлу:
<link rel = "stylesheet" href = "~/My_Project.styles.css" />
Но мне пришлось использовать фактическое имя проекта (без подчеркивания):
<link rel = "stylesheet" href = "~/My Project.styles.css" />
где твой
{application}.styles.css? он существует в папке wwwroot?