如何将 Bundle Config 添加到 Startup.cs 以在 Razor 视图中使用资源？答案

【问题标题】：How can I add Bundle Config to Startup.cs for resources to use in Razor Views?如何将 Bundle Config 添加到 Startup.cs 以在 Razor 视图中使用资源？
【发布时间】：2021-10-13 05:26:04
【问题描述】：

问题。如何向 Startup.cs（ASP.NET Core 项目）添加与使用 App_Start > BundleConfig.cs 相同的配置

当有：

public class BundleConfig
{
    // For more information on bundling, visit http://go.microsoft.com
/fwlink/?LinkId=301862
    public static void RegisterBundles(BundleCollection bundles)
    {
        bundles.Add(new ScriptBundle("~/bundles/jquery").Include(
                    "~/Scripts/jquery-{version}.js"));

        bundles.Add(new ScriptBundle("~/bundles/jqueryval").Include(
                    "~/Scripts/jquery.validate*"));


        bundles.Add(new ScriptBundle("~/bundles/modernizr").Include(
                    "~/Scripts/modernizr-*"));

        bundles.Add(new ScriptBundle("~/bundles/bootstrap").Include(
                  "~/Scripts/bootstrap.js",
                  "~/Scripts/respond.js"));

        bundles.Add(new StyleBundle("~/Content/css").Include(
                  "~/Content/bootstrap.css",
                  "~/Content/site.css"));
    }

然后：

@Scripts.Render("~/bundles/jquery")
@Scripts.Render("~/bundles/bootstrap")

例如...

【问题讨论】：

标签： asp.net-core asp.net-core-mvc

【解决方案1】：

MVC5 中存在的捆绑和缩小不再存在于 MVC Core 中。

您的选择是（无需深入研究 Node 生态系统 - 这同样有效，但会引入更多概念）：

使用bundling and minification Visual Studio extension。
或使用command line bundling and minification dotnet tool。

这两种工具都在同一个基础架构上运行。他们使用bundleConfig.json 文件来描述你的包的结构（什么文件进入，什么文件出来，是否包含源映射等）

这两个概念的解释也可以通过documentation获得。

您可以使用taghelpers 在指向缩小和未缩小资源的链接之间切换，而不是调用@Scripts.Render() 来生成指向缩小或未缩小资源的链接。例如：

<environment names="Development">
    <script src="~/unminified.js"></script>
</environment>
<environment names="Staging,Production">
    <script src="~/bundledandminified.min.js"></script>
</environment>

【讨论】：

【解决方案2】：

我需要 System.Web.Optimization 的运行时捆绑功能（能够进行动态的 Less 编译?），因此我实现了 NET Core 替代品，现在我决定在 MIT 许可下使用 publish it .

如果要使用，首先需要安装一个实现的NuGet包：

dotnet add package Karambolo.AspNetCore.Bundling.NUglify

或

dotnet add package Karambolo.AspNetCore.Bundling.WebMarkupMin

你喜欢哪个压缩库。

那你需要在Startup.ConfigureServices()的DI容器中注册：

services.AddBundling()
    .UseDefaults(_env)
    .UseNUglify(); // or .WebMarkupMin(), respectively

字段_env是对IHostingEnvironment的引用，可以在构造函数中注入。

现在您可以在 Configure() 方法中配置您的包，如下所示：

app.UseBundling(bundles =>
{
    bundles.AddJs("/jquery.js")
        .Include("/Scripts/jquery-*.js");

    bundles.AddJs("/jqueryval.js")
        .Include("/Scripts/jquery.validate*");

    // and so on...
});

注意波浪线和“/bundles”前缀被移除（因为它是自动添加的）以及添加到包路径的扩展。需要使用与捆绑包的输出相对应的正确扩展名。

将以下内容添加到您的 _ViewImports.cshtml：

@using Karambolo.AspNetCore.Bundling.ViewHelpers
@addTagHelper *, Karambolo.AspNetCore.Bundling

在 Razor 视图中，您可以使用熟悉的语法：

@await Scripts.RenderAsync("~/bundles/jquery.js")
@await Scripts.RenderAsync("~/bundles/jqueryval.js")

或新的标签助手语法：

<script src="~/bundles/jquery.js"></script>
<script src="~/bundles/jqueryval.js"></script>

请注意，您必须在视图中添加波浪号和前缀。有关此内容和其他详细信息的更多信息，请参阅project page。

【讨论】：

【解决方案3】：

Core 5.0 docs note 那个WebOptimizer is a compatible solution。

ASP.NET Core 与 WebOptimizer 兼容，这是一种开源捆绑和缩小解决方案。有关设置说明和示例项目，请参阅 WebOptimizer。 ASP.NET Core 不提供本机捆绑和缩小解决方案。

Gulp 和 Webpack 等第三方工具为捆绑和缩小以及 linting 和图像优化提供工作流自动化。通过使用设计时捆绑和缩小，缩小的文件是在应用程序部署之前创建的。在部署之前捆绑和缩小提供了减少服务器负载的优势。但是，重要的是要认识到设计时捆绑和缩小会增加构建复杂性并且仅适用于静态文件。

【讨论】：