System.Web.Optimization在最小化javascript时会改变js文件的顺序
本文关键字:js 改变 文件 顺序 Optimization Web 最小化 javascript System | 更新日期: 2023-09-27 18:19:03
当我使用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);
}
,但当我打开缩小,我得到javascript错误,并通过检查在chrome开发人员工具缩小文件的开始,我可以立即看到,顺序是混乱的。
在即时窗口当我执行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"
显示顺序被保留,但是当我动态地将它最小化时(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}),...
这是OnTheMove_TheApplication.js
的开始,而不是我期待的jquery-1.7.1.js
。我看到的一个解决方案是将它分成更多的bundle,并尝试以这种方式处理它。
为什么minifier不保持顺序?我的期望错了吗?
我通过创建扩展来解决这个问题:
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;
}
}
然后,你可以注册你的bundle
bundles.Add(new ScriptBundle("~/bundles/home")
.Include("~/Scripts/leaflet-0.6.4.js")
.Include("~/Scripts/oms.js")
.Include("~/Scripts/home.js").ForceOrdered()
);