如何让 ASP.NET MVC 捆绑管理器呈现类型为 = "module" 属性的脚本标记？

Question

当我们像这样将捆绑包添加到 ASP.NET MVC 捆绑包集合时：

public static RegisterBundles(BundleCollection bundles)
{
  bundles.Add( new ScriptBundle("~/bundle/foo")
               .Include("~/Scripts/foo.js"));
}

并在如下所示的视图中呈现它：

@Scripts.Render("~/bundle/foo")

它像一个常规的javascript文件包含一样呈现，<script>如下所示：

<script src = "/Scripts/foo.js"></script>

但是我的foo.js是一个ES 6模块，所以我希望它像这样加载：

<script src = "/Scripts/foo.js" type = "module"></script>

除了自己键入该<script>标记之外，我如何实际获得 ASP.NET MVC 捆绑类以这种方式呈现它？

我正在使用 ASP.NET MVC 5.2.4 针对 .NET 框架版本 4.6.1。

Answer 1

我假设您安装了最新的Microsoft.AspNet.Web.Optimization软件包，因此您可以使用Scripts.RenderFormat()在生成的<script>标签上添加type属性：

@Scripts.RenderFormat("<script src='{0}' type='module'></script>", "~/bundle/foo")

或者，您可以使用包含帮助程序方法的帮助程序类来呈现具有某些捆绑包的附加属性的<script>标记：

public static class ScriptHelpers
{
    public static IHtmlString RenderWithTypeAttribute(params string[] paths)
    {
        return System.Web.Optimization.Scripts.RenderFormat(@"<script src=""{0}"" type=""module""></script>", paths);
    }
}

然后在 Razor 视图页面中使用它，如下所示：

@ScriptHelpers.RenderWithTypeAttribute("~/bundle/foo")

参考：

如何在 MVC 中以自定义格式呈现脚本/样式包 ASP.NET？

相关问题：

在 MVC4 脚本包中设置脚本类型