ASP.NET MVC中能否修改ScriptBundle的渲染输出模板？

不管你想让修改对所有Bundle生效，还是只针对特定Bundle，都有可行的实现方式，下面我给你详细讲几种常用方法：

一、全局修改所有ScriptBundle的渲染模板（最简单） #

当EnableOptimizations = false时，ScriptBundle默认会用<script src="{0}"></script>这个模板渲染每个单独的脚本文件。你可以直接替换全局默认的模板，让所有ScriptBundle都用新格式输出：

在BundleConfig.cs的RegisterBundles方法里添加这段代码：

// 替换默认的单个脚本渲染模板，比如添加async属性
ScriptBundle.DefaultItemTemplate = "<script src=\"{0}\" async></script>";

// 正常注册你的Bundle即可
bundles.Add(new ScriptBundle("~/bundles/jquery").Include(
            "~/Scripts/jquery-{version}.js"));

如果需要修改合并后的单个脚本标签（EnableOptimizations = true时的输出），可以修改全局的Bundle模板：

ScriptBundle.DefaultBundleTemplate = "<script src=\"{0}\" defer></script>";

二、创建自定义ScriptBundle子类（针对特定Bundle） #

如果你只想让某些Bundle使用自定义渲染格式，可以继承ScriptBundle类，自己定义模板或渲染逻辑：

1. 简单自定义模板 #

public class CustomScriptBundle : ScriptBundle
{
    public CustomScriptBundle(string virtualPath) : base(virtualPath)
    {
        // 设置当前Bundle专属的单个脚本渲染模板
        ItemTemplate = "<script src=\"{0}\" defer></script>";
        // 如果需要修改合并后的模板，也可以在这里设置
        // BundleTemplate = "<script src=\"{0}\" defer></script>";
    }
}

注册Bundle时使用自定义类：

bundles.Add(new CustomScriptBundle("~/bundles/custom").Include(
            "~/Scripts/custom1.js",
            "~/Scripts/custom2.js"));

2. 复杂自定义渲染逻辑 #

如果需要更灵活的控制（比如根据脚本文件名添加不同属性、修改路径等），可以重写Render方法：

public class SmartScriptBundle : ScriptBundle
{
    public SmartScriptBundle(string virtualPath) : base(virtualPath) { }

    public override IHtmlString Render(BundleContext context)
    {
        // 非优化模式下自定义渲染
        if (!context.EnableOptimizations)
        {
            var scriptUrls = GetBundleFiles(context)
                .Select(file => context.BundleCollection.ResolveBundleUrl(file.IncludedVirtualPath));
            
            var htmlBuilder = new StringBuilder();
            foreach (var url in scriptUrls)
            {
                // 给jquery脚本添加async属性，其他脚本添加defer
                var attr = url.Contains("jquery") ? " async" : " defer";
                htmlBuilder.AppendFormat("<script src=\"{0}\"{1}></script>\n", url, attr);
            }
            return new HtmlString(htmlBuilder.ToString());
        }

        // 优化模式下使用默认渲染逻辑
        return base.Render(context);
    }
}

这样就能根据不同脚本实现差异化的渲染输出了。

内容的提问来源于stack exchange，提问作者Eddi