简体   繁体   English

在缩小javascript时,System.Web.Optimization会更改js文件的顺序

[英]System.Web.Optimization changes order of js files when minifying javascript

I am observing a very peculiar behaviour when minifying files with System.Web.Optimization , I am already using IBundleOrderer that works fine in preserving file order when I am not minifying the files 使用System.Web.Optimization缩小文件时,我观察到一种非常奇怪的行为,我已经在使用IBundleOrderer ,当我没有缩小文件时,它可以很好地保存文件顺序

public class RespectGivenBundleOrder : IBundleOrderer
{
    public IEnumerable<BundleFile> OrderFiles(BundleContext context, IEnumerable<BundleFile> files)
    {
        return files;
    }
}

public static void RegisterTestingBundle(BundleCollection bundles)
    {
        var bundle = new ScriptBundle("~/OnTheMoveWebFiles/bundles/Testing");
        bundle.Orderer = new RespectGivenBundleOrder();
        bundle.Include(
            string.Format("{0}jquery-{{version}}.js", baseJSFolder),
            string.Format("{0}ua-parser.js", baseJSFolder),
            string.Format("{0}OnTheMove_Core.js", baseJSFolder),
            string.Format("{0}OnTheMove_TheApplication.js", baseJSFolder),
            string.Format("{0}OnTheMove_JQMQueryString.js", baseJSFolder),
            string.Format("{0}OnTheMove_OfflineAuditing.js", baseJSFolder),
            string.Format("{0}OnTheMove_DatabaseManager.js", baseJSFolder),
            string.Format("{0}OnTheMove.js", baseJSFolder),
            string.Format("{0}OnTheMove_Offline.js", baseJSFolder),
            string.Format("{0}OnTheMove_DatabaseLoader.js", baseJSFolder),
            string.Format("{0}OnTheMove_DatabaseTestHelper.js", baseJSFolder),
            string.Format("{0}OnTheMove_SmartScriptPlayer.js", baseJSFolder),
            string.Format("{0}jasmine.js", baseJSFolder),
            string.Format("{0}jasmine-html.js", baseJSFolder),
            string.Format("{0}jasmine-jquery-{{version}}.js", baseJSFolder),
            string.Format("{0}jasmine-OnTheMove-GenericMocksAndHelpers.js", baseJSFolder),
            string.Format("{0}jasmine-OnTheMove-DatabaseManager-SiebelToSQL-Tests.js", baseJSFolder),
            string.Format("{0}jasmine-OnTheMove-TreeValidator-Tests.js", baseJSFolder),
            string.Format("{0}jasmine-OnTheMove-GlobalFunction-Tests.js", baseJSFolder),
            string.Format("{0}jasmine-OnTheMove-OnTheMove_BusinessComponent-Tests.js", baseJSFolder),
            string.Format("{0}jasmine-OnTheMove_DatabaseTestHelper-Tests.js", baseJSFolder),
            string.Format("{0}jasmine-OnTheMove_OfflineAuditing-Tests.js", baseJSFolder),
            string.Format("{0}jasmine-OnTheMove-JQueryExtension-Tests.js", baseJSFolder));
        bundles.Add(bundle);
    }

but when I do turn the minification on I am getting javascript errors and by inspecting the beginning of minified file in chrome developer tools I can immediately see that order is messed up. 但是当我开始缩小时,我会收到javascript错误,并且通过检查chrome开发人员工具中缩小文件的开头,我可以立即看到该订单搞砸了。

In immediate window when I execute var cont = new BundleResolver(BundleTable.Bundles ).GetBundleContents("~/OnTheMoveWebFiles/bundles/Testing") I get 在我执行var cont = new BundleResolver(BundleTable.Bundles ).GetBundleContents("~/OnTheMoveWebFiles/bundles/Testing")即时窗口中我得到

Count = 23
    [0]: "~/OnTheMoveWebFiles/js/jquery-1.7.1.js"
    [1]: "~/OnTheMoveWebFiles/js/ua-parser.js"
    [2]: "~/OnTheMoveWebFiles/js/OnTheMove_Core.js"
    [3]: "~/OnTheMoveWebFiles/js/OnTheMove_TheApplication.js"
    [4]: "~/OnTheMoveWebFiles/js/OnTheMove_JQMQueryString.js"
    [5]: "~/OnTheMoveWebFiles/js/OnTheMove_OfflineAuditing.js"
    [6]: "~/OnTheMoveWebFiles/js/OnTheMove_DatabaseManager.js"
    [7]: "~/OnTheMoveWebFiles/js/OnTheMove.js"
    [8]: "~/OnTheMoveWebFiles/js/OnTheMove_Offline.js"
    [9]: "~/OnTheMoveWebFiles/js/OnTheMove_DatabaseLoader.js"
    [10]: "~/OnTheMoveWebFiles/js/OnTheMove_DatabaseTestHelper.js"
    [11]: "~/OnTheMoveWebFiles/js/OnTheMove_SmartScriptPlayer.js"
    [12]: "~/OnTheMoveWebFiles/js/jasmine.js"
    [13]: "~/OnTheMoveWebFiles/js/jasmine-html.js"
    [14]: "~/OnTheMoveWebFiles/js/jasmine-jquery-1.7.0.js"
    [15]: "~/OnTheMoveWebFiles/js/jasmine-OnTheMove-GenericMocksAndHelpers.js"
    [16]: "~/OnTheMoveWebFiles/js/jasmine-OnTheMove-DatabaseManager-SiebelToSQL-Tests.js"
    [17]: "~/OnTheMoveWebFiles/js/jasmine-OnTheMove-TreeValidator-Tests.js"
    [18]: "~/OnTheMoveWebFiles/js/jasmine-OnTheMove-GlobalFunction-Tests.js"
    [19]: "~/OnTheMoveWebFiles/js/jasmine-OnTheMove-OnTheMove_BusinessComponent-Tests.js"
    [20]: "~/OnTheMoveWebFiles/js/jasmine-OnTheMove_DatabaseTestHelper-Tests.js"
    [21]: "~/OnTheMoveWebFiles/js/jasmine-OnTheMove_OfflineAuditing-Tests.js"
    [22]: "~/OnTheMoveWebFiles/js/jasmine-OnTheMove-JQueryExtension-Tests.js"

which shows that order is being preserved, however when I minify it on the fly ( var contents =BundleManager.GetBundleContents("~/OnTheMoveWebFiles/bundles/Testing"); ) I get 这表明订单正在保存,但是当我在运行中缩小它时( var contents =BundleManager.GetBundleContents("~/OnTheMoveWebFiles/bundles/Testing"); )我得到了

"function TheApplication(){return window.onTheMove.theApplication}function decodeQueryString(n,t,i,r){var f,u={},s,h,e,o;if(i||(i=function(){return}),...

Which is beginning of OnTheMove_TheApplication.js and not jquery-1.7.1.js that I am expecting. 这是OnTheMove_TheApplication.js开头,而不是我期待的jquery-1.7.1.js One solution I see is to split it apart into more bundles and try to handle it that way. 我看到的一个解决方案是将它拆分成更多的捆绑包并尝试以这种方式处理它。
Why minifier is not preserving order? 为什么minifier不保留秩序? Is my expectation wrong? 我的期望是错的吗?

I managed solving this issue by creating an extension : 我通过创建扩展来解决此问题:

public class AsIsBundleOrderer : IBundleOrderer
{
    public virtual IEnumerable<FileInfo> OrderFiles(BundleContext context, IEnumerable<FileInfo> files)
    {
        return files;
    }
}

internal static class BundleExtensions
{
    public static Bundle ForceOrdered(this Bundle sb)
    {
        sb.Orderer = new AsIsBundleOrderer();
        return sb;
    }
}

Then, you can register your bundle 然后,您可以注册您的包

bundles.Add(new ScriptBundle("~/bundles/home")
            .Include("~/Scripts/leaflet-0.6.4.js")
            .Include("~/Scripts/oms.js")
            .Include("~/Scripts/home.js").ForceOrdered()

        );

暂无
暂无

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

相关问题 有没有办法在使用System.Web.Optimization捆绑最小化时禁用js / css验证? - Is there a way to disable js/css validation when using System.Web.Optimization Bundling minimisation? 要添加System.Web.Optimization错误 - System.Web.Optimization error to add ASP.NET System.Web.Optimization:捆绑jQueryUI CSS - ASP.NET System.Web.Optimization: Bundling jQueryUI CSS 获取对System.Web.Optimization中使用的URL的访问 - Get access to the URL's being used in System.Web.Optimization 如何避免在布局页面中使用“使用System.Web.Optimization” - How to avoid using “using System.Web.Optimization” in layout page 如何引用System.Web.Optimization程序集的1.1.0.0版 - How to reference version 1.1.0.0 of System.Web.Optimization assembly 为System.Web.Optimization安装了Nuget程序包,复制System.Web.Optimization.xml文件时不断出错。访问被拒绝 - Installed Nuget package for System.Web.Optimization, keep getting error copying the System.Web.Optimization.xml file.. access denied 无法加载文件或程序集“System.Web.Optimization”或其依赖项之一 - Could not load file or assembly 'System.Web.Optimization' or one of its dependencies 使用 System.Web.Optimization 捆绑,我如何访问构建捆绑的结果? - Using System.Web.Optimization Bundling, How Can I access The Result of a Built Bundle? 有没有办法防止通过asp.net System.Web.Optimization 重命名某些变量 - Is there a way to prevent some variables being renamed via asp.net System.Web.Optimization
 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM