如何在 ASP.net Core 中添加 js 和 css 文件？
Posted
技术标签:
【中文标题】如何在 ASP.net Core 中添加 js 和 css 文件？【英文标题】：How to add js and css files in ASP.net Core? 【发布时间】：2016-10-03 19:35:44 【问题描述】：我被分配将应用程序从 MVC 迁移到 ASP.net Core，我是 ASP.net Core 的新手。在 MVC 中我们有 BundleConfig.cs 并在其中添加对我们的 css 和 js 文件的引用，它在 ASP.net Core 中是如何工作的？假设我创建了一个test.js 和一个MyStyle.css 类，这是在每个视图中添加对它的引用的最佳方式吗？我应该将.js 和.css 文件放在wwwroot/js 和wwwroot/css 中吗？
【问题讨论】：
【参考方案1】：我在_Layout 视图内添加了引用，在<environment> 标签内：
<environment names="Development">
<link rel="stylesheet" href="~/css/MyCss.css" />
</environment>
如果有人知道更好的方法，我会欢迎它
【讨论】：
你知道它对特定的 css 视图文件是如何工作的吗？ 我认为这个答案是不完整的。为此，您需要将css 文件夹放在wwwroot 文件夹中。另外，还需要在Startup类的Configure方法中添加app.UseStaticFiles()。
您应该将 css 文件放在什么位置？
@Shimmy 查看 wwwroot 文件夹【参考方案2】：
更好的方法是在路由之前使用：app.UseStaticFiles(); inside startup.cs。
【讨论】：
你能解释一下为什么这样更好吗？ 欲了解更多信息，请参阅：docs.microsoft.com/en-us/aspnet/core/fundamentals/…【参考方案3】：回答这个问题可能有点晚了，但对于那些通过 Google 来到这里的人：我发现添加 asp-append-version="true" 对我有用，因为其他答案中给出的所有其他选项已经在 @ 中提供987654322@.
【讨论】：
【参考方案4】：我将 JS 和 CSS 文件放在我的应用程序的 wwwroot 文件夹中的 assets 文件夹中，然后在我的 _Layout.cshtml 中使用链接标签来引入样式。 Steven Sanderson 有一篇博文的一部分，他谈到了添加第三方库 here。
您也可以使用 webpack 进行某种设置。我承认，这个话题不是很直接。
【讨论】：
【参考方案5】：在_布局中：
@await RenderSectionAsync("Styles", required: false)
那么你的看法：
@section Styles your CSS
信息来自： https://dev.to/amjadmh73/loading-custom-css-files-in-razor-pages-4no9
【讨论】：
这并没有提供问题的答案。一旦你有足够的reputation，你就可以comment on any post；相反，provide answers that don't require clarification from the asker。 - From Review 为了扩展@lidermin 的观点，问题是关于如何从every 视图引用资产。您的回答似乎是在回答一个不同的问题，类似于“如何允许视图将样式注入<head /> 部分？”但是，使用您的方法，OP 将不得不在每个视图上重复包含的脚本和样式。【参考方案6】：
我将 CSS 文件放在 ~/wwwroot/cs 中，将 javascript 文件放在 ~/wwwroot/js 中。然后我按照默认的_Layout.cshtml文件的格式。
<head>
. . .
<link type="text/css" rel="stylesheet" href="~/css/myCSS.min.css" />
. . .
</head>
<body>
. . .
<script src="~/js/myJS.min.js" asp-append-version="true"></script>
@RenderSection("Scripts", required: false)
. . .
</body>
【讨论】：
这种方式无法加载asp.net core mvc中的文件。【参考方案7】：图像文件、CSS 文件和 JavaScript JS 文件等静态文件在 ASP.Net Core 中不起作用，除非它与项目一起放置在适当的位置并设置了一些设置。 并在 start up.css 中添加这一行用于路由。
app.UseStaticFiles();
【讨论】：
以上是关于如何在 ASP.net Core 中添加 js 和 css 文件？的主要内容，如果未能解决你的问题，请参考以下文章
如何在 asp.net core 的其他表中添加数据和删除相同的数据？
Asp.Net core MVC6如何在Identity 3中初始添加角色