在 MVC 5 中使用捆绑和缩小的 IgniteUI 资源时找不到资源

Resource not found When using Bundled & Minified IgniteUI Resources in MVC 5

我有一个使用 Infragistics IgniteUI 的 ASP.Net MVC 5 项目。当我使用捆绑和缩小的基础设施脚本和样式表加载 igniteui 图表或网格时,出现错误。当我使用非捆绑版本时,我没有收到错误。

更新 我也试过在禁用缩小的情况下进行捆绑,但仍然会产生错误。

为什么我使用捆绑文件时它会在 /bundles/ 路径中寻找图像?

我可以做些什么来防止在使用捆绑时出现这些错误?

错误

The controller for path '/bundles/images/ui-icons_888888_256x240.png' was not found or does not implement IController.

The controller for path '/bundles/images/igLoadingSmall.gif' was not found or does not implement IController.

捆绑配置

#region Scripts
    ...            
    bundles.Add(new ScriptBundle("~/bundles/igniteui_full_js").Include(
            "~/Scripts/IgniteUI/js/infragistics.core.js",
            "~/Scripts/IgniteUI/js/infragistics.dv.js",
            "~/Scripts/IgniteUI/js/infragistics.lob.js",
            "~/Scripts/IgniteUI/js/infragistics.loader.js"
        ));
#endregion

#region Styles
    ...
    bundles.Add(new StyleBundle("~/bundles/igniteui_full_css").Include(
            "~/Content/IgniteUI/css/themes/infragistics/infragistics.theme.css",
            "~/Content/IgniteUI/css/structure/infragistics.css"
        ));
#endregion

Layout Head Razor 代码

    <!-- Header Styles-->
    @Styles.Render(
        "~/bundles/css",
        "~/bundles/igniteui_full_css"
    )

    <!-- Header Scripts-->
    @Scripts.Render(
            "~/bundles/jquery",
            "~/bundles/ajax",
            "~/bundles/modernizr",
            "~/bundles/bootstrap",
            "~/bundles/site",
            "~/bundles/igniteui_full_js"
        )

Unbundled Head - 不会产生错误

<head>
    <meta charset="utf-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0">

    <!-- Header Styles-->
    <link href="/Content/bootstrap-multiselect.css" rel="stylesheet"/>
    <link href="/Content/bootstrap.css" rel="stylesheet"/>
    <link href="/Content/site.css" rel="stylesheet"/>
    <link href="/Content/Dashboard.css" rel="stylesheet"/>
    <link href="/Content/IgniteUI/css/themes/infragistics/infragistics.theme.css" rel="stylesheet"/>
    <link href="/Content/IgniteUI/css/structure/infragistics.css" rel="stylesheet"/>

    <!-- Header Scripts-->
    <script src="/Scripts/jquery-2.2.0.js"></script>
    <script src="/Scripts/jquery-ui-1.11.4.js"></script>
    <script src="/Scripts/jquery.validate.js"></script>
    <script src="/Scripts/jquery.validate.unobtrusive.js"></script>
    <script src="/Scripts/validator.js"></script>
    <script src="/Scripts/jquery.browser.mobile.js"></script>
    <script src="/Scripts/jquery.unobtrusive-ajax.js"></script>
    <script src="/Scripts/bootstrap.js"></script>
    <script src="/Scripts/respond.js"></script>
    <script src="/Scripts/bootstrap-multiselect.js"></script>
    <script src="/Scripts/site.js"></script>
    <script src="/Scripts/IgniteUI/js/infragistics.core.js"></script>
    <script src="/Scripts/IgniteUI/js/infragistics.dv.js"></script>
    <script src="/Scripts/IgniteUI/js/infragistics.lob.js"></script>
    <script src="/Scripts/IgniteUI/js/infragistics.loader.js"></script>
</head>

捆绑头 - 产生错误

<head>
    <meta charset="utf-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0">

    <!-- Header Styles-->
    <link href="/bundles/css?v=DOErVhQffVVJij5tRivXIDYvvea9XjXYoWkD6iph4yo1" rel="stylesheet"/>
    <link href="/bundles/igniteui_full_css?v=oMN-4N9H6hCThCn7D6WHIiusJgqj7Qk9KfeKje7iGdI1" rel="stylesheet"/>

    <!-- Header Scripts-->
    <script src="/bundles/jquery?v=3wcNYlWV3nKyr3gSm0Ry9LrwfpXaysXErYMcQN9fkcw1"></script>
    <script src="/bundles/ajax?v=jmjhTWiGrUMlGQS2hayanNTeGVZ9FC7i0HnCBpQ4IZ81"></script>
    <script src="/bundles/modernizr?v="></script>
    <script src="/bundles/bootstrap?v=kNIhecyepPMk8f_DFvoGkBz2T4zIItHFFHq2488ZHwY1"></script>
    <script src="/bundles/site?v=stk1SwAEJZvoHt7p5QZ9202zmQ1IeBvXWmqmxFpIXI01"></script>
    <script src="/bundles/igniteui_full_js?v=6y5k9Wl7x2PlzNsRN0azCfVIh1oR8SLPZohqnlbLrNo1"></script>
</head>

查看

@using Infragistics.Web.Mvc
@using MyProject.Web.Website.ViewModels

@model ReportViewModel

@(Html.Infragistics()
    .Grid(Model.ReportData.AsQueryable())
    .ID("grid")
    .AutoGenerateColumns(true)
    .AutoGenerateLayouts(true)
    .DataBind()
    .Render()
)

我认为问题是您需要一个 CssRewriteUrlTransform,因为捆绑更改了应该引用资源的位置。

bundles.Add(new StyleBundle("~/bundles/igniteui_full_css")
       .Include("~/Content/IgniteUI/themes/infragistics/infragistics.theme.css", new CssRewriteUrlTransform())
       .Include("~/Content/IgniteUI/structure/infragistics.css", new CssRewriteUrlTransform()));

附带说明一下,您可以在捆绑所有组合脚本文件时从脚本包中删除 infragistics.loader.js,因此不需要加载程序。