指定した順序でバンドルする@ASP.NET
ASP.NETでスクリプトをバンドル出来ますが、かゆいところに手が届かない部分があるのでまとめておきます。
通常のバンドル
ASP.NETでスクリプトをバンドルするとき下記のように書きます。
public class BundleConfig { public static void RegisterBundles(BundleCollection bundles) { bundles.Add(new ScriptBundle("~/bundles/scripts").Include( "~/Scripts/jquery.js", "~/Scripts/jquery-ui.js" "~/Scripts/bootstrap.js")); } }
ただし、スクリプトが読み込まれる順番はランダムなので、jquery読み込んだ後にjquery-ui読み込むといったことがデフォルトでは出来ません。
デフォルトでパス追加した順序で読み込んでくれればいいのに!
指定した順序でバンドル
まず、下記のクラスを用意します。
public class AsIsBundleOrderer : IBundleOrderer { public IEnumerable<BundleFile> OrderFiles(BundleContext context, IEnumerable<BundleFile> files) { return files; } }
続けて、バンドルに読み込みたい順序でスクリプトのパスを追加し、バンドルの順序を指定します。
public class BundleConfig { public static void RegisterBundles(BundleCollection bundles) { var bundle = new ScriptBundle("~/bundles/scripts") .Include("~/Scripts/jquery.js") .Include("~/Scripts/jquery-ui.js") .Include("~/Scripts/bootstrap.js"); // バンドルの順序をバンドルにファイルを追加した順序にします bundle.Orderer = new AsIsBundleOrderer(); bundles.Add(bundle); } }
後は画面で読み込めば、指定した順序でスクリプトが読み込まれます。
@using System.Web.Optimization <head> @Scripts.Render("~/bundles/scripts") </head>