Asp.Net Core 6 将 Bootstrap 添加到脚手架 Identity _Layout.cshtml

Posted 2023-03-27

【中文标题】Asp.Net Core 6 将 Bootstrap 添加到脚手架 Identity _Layout.cshtml

【英文标题】：Asp.Net Core 6 Add Bootstrap to scaffolded Identity _Layout.cshtml

【发布时间】：2021-10-09 18:35:51

【问题描述】：

我正在使用 VS2022 Preview 并使用 Angular 和 VS2022 中的默认项目创建了一个单页应用程序。我已经搭建了身份页面，以便我可以通过使用 Bootswatch 中的一个覆盖引导程序来更改样式。但是，当我尝试从 wwwroot 中的 lib 文件夹中引用引导程序时，如下所示：

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

然后我得到错误：

Refused to apply style from 'https://localhost:5002/lib/bootstrap/css/bootstrap.min.css' because its MIME type ('text/html') is not a supported stylesheet MIME type, and strict MIME checking is enabled.

我在这里尝试了各种文件路径，但似乎没有任何效果。任何帮助都会很棒，因为这似乎是一项微不足道的任务！

【问题讨论】：

在 ASP.NET Core SPA 中默认使用 Bootstrap，为什么还要重新添加呢？ index.html中不是已经添加了吗？

【参考方案1】：

_Layout.cshtml 页面是由 Scaffolded Identity 生成的，对吧？

如果是这种情况，Identity 包还包含 Bootstrap 引用，默认情况下，_Layout.cshtml 页面已经使用以下代码添加了 bootstrap 引用，您可以考虑将其用作解决方法。

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

结果如下：

此外，您还可以尝试使用 CDN 参考：

<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.5.2/css/bootstrap.min.css" />

【参考方案2】：

请将您的 lib 文件夹移动到 wwwroot 文件夹并从那里引用它。