如何让 ASP.NET MVC 包管理器呈现带有 type = "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 包类以这种方式呈现它？

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

Answer 1

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

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

或者，您可以使用包含 helper 方法的 helper 类来<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")

参考：

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

相关问题：

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