asp.net-mvc - mvc4 bundle ，它是如何工作的？

Question

在mvc4中，它们使用 bundle 软件一次调用所有脚本和css文件。据我所知，js和cs文件的排序在您调用它们时很重要。如果我使用 bundle 软件，我怎么知道 bundle 软件内的css和js文件的顺序是否正确？我可以自定义订购吗？

我现在有一个日期选择器问题，似乎它的css文件/主题无法正确加载，所以我想检查一下 bundle 如何订购css/js文件...谢谢:)

<link href="@System.Web.Optimization.BundleTable.Bundles.ResolveBundleUrl("~/Content/css")" rel="stylesheet" type="text/css" />
<link href="@System.Web.Optimization.BundleTable.Bundles.ResolveBundleUrl("~/Content/themes/base/css")" rel="stylesheet" type="text/css" />
<script src="@System.Web.Optimization.BundleTable.Bundles.ResolveBundleUrl("~/Scripts/js")"></script>

Answer 1

这个问题的答案很晚，但是ASP.NET MVC按字母顺序对文件进行排序。您也可以使用IBundleOrderer界面手动订购脚本文件。

例如，使用这样的自定义IBundleOrderer实现:

Bundle myBundle = new Bundle("~/bundles/SiteScripts", new JsMinify());
myBundle.IncludeDirectory("~/Scripts/SiteScripts", "*.js");
myBundle.Orderer = new MyBundleOrderer();
bundles.Add(myBundle);

MyBundleOrderer从web.config文件获取高优先级脚本:

public class MyBundleOrderer : IBundleOrderer
{
    public IEnumerable<System.IO.FileInfo> OrderFiles(BundleContext context, IEnumerable<FileInfo> files)
    {
        if (ConfigurationManager.AppSettings["HighPriorityScripts"] != null)
        {
            string[] highPriorityScripts = ConfigurationManager.AppSettings["HighPriorityScripts"].Split(',');
            List<FileInfo> listFiles = new List<FileInfo>(files);
            List<FileInfo> orderedFiles = new List<FileInfo>();

            // Add high priority files in order : 
            foreach (string highPriorityFile in highPriorityScripts)
            {
                FileInfo nextFileInfo = listFiles.Find(delegate(FileInfo arg) 
                                {
                                    return arg.Name == highPriorityFile;
                                }
                              );
                if (nextFileInfo != null)
                {
                    orderedFiles.Add(nextFileInfo);
                }
            }

            // Add remaining files to bundle : 
            foreach (FileInfo lowPriorityFile in listFiles)
            {
                if (!orderedFiles.Contains(lowPriorityFile))
                {
                    orderedFiles.Add(lowPriorityFile);
                }
            }

            return orderedFiles;
        }
        return files;
    }
}