实体框架脚手架控制器返回损坏的页面

Question

按照Microsoft关于现有项目的Getting Started with EF Core on ASP.NET Core with a New database教程进行操作后，我的实体页面变得非常空白且无法使用：

没有引发任何错误，但是页面上的元素不起作用并且显然没有正确设置样式。根据教程，它应该是这样的：

我想问题是，我不是从项目（see code）中的模板开始的，而是一个现有项目。我不知道我的代码中可能缺少什么...

由于我也不是我的问题所在，所以我不会只发布程序中的所有代码。如果有什么重要的事情，我很高兴添加。

---

边注：由于缺少以下几行，因此出现了先前的错误，该错误在同一URL上出现404错误：

        app.UseMvc(routes =>
        {
            routes.MapRoute(
                name: "default",
                template: "{controller=Home}/{action=Index}/{id?}");
        });

Answer 1

默认情况下，ASP.NET Core模板使用Boostrap设置样式。

不幸的是，似乎Bootstrap文件未包含在示例项目中。最可能是由于.gitignore造成的。如果您使用dotnet new或Visual Studio中包含的模板从一个新的Web项目开始，则将包括它们。

Here，您会看到Layout.cshtml在开发环境中正在寻找

<link rel="stylesheet" href="~/lib/bootstrap/dist/css/bootstrap.css" />

但是因为未使用源代码签入Bootstrap，所以您没有收到它。

您可以在此Microsoft Doc

中找到更多信息，以及如何通过Bower实际检索依赖项。

但是，正如页面所述，鲍尔现在不推荐用于新项目。 Bower本身建议使用Yarn或Webpack，Microsoft建议使用LibMan或Webpack。

最后，如果您只是测试示例项目，则甚至根本不需要在计算机上拥有boostrap的本地副本。最简单的方法是包括CDN版本，无论环境设置如何。

Views/Shared/_Layout.cshtml

替换

<environment include="Development">
    <link rel="stylesheet" href="~/lib/bootstrap/dist/css/bootstrap.css" />
    <link rel="stylesheet" href="~/css/site.css" />
</environment>
<environment exclude="Development">
    <link rel="stylesheet" href="https://ajax.aspnetcdn.com/ajax/bootstrap/3.3.7/css/bootstrap.min.css"
          asp-fallback-href="~/lib/bootstrap/dist/css/bootstrap.min.css"
          asp-fallback-test-class="sr-only" asp-fallback-test-property="position" asp-fallback-test-value="absolute" />
    <link rel="stylesheet" href="~/css/site.min.css" asp-append-version="true" />

使用

<environment include="Development">
    <link rel="stylesheet" href="~/css/site.css" />
</environment>
<environment exclude="Development">
    <link rel="stylesheet" href="~/css/site.min.css" asp-append-version="true" />
</environment>
<link rel="stylesheet" href="https://ajax.aspnetcdn.com/ajax/bootstrap/3.3.7/css/bootstrap.min.css" />