脚本和样式包

以下是 BundleConfig.cs 文件的默认代码段。

using System.Web.Optimization;

public class BundleConfig  
{  
    // For more information on Bundling, visit http://go.microsoft.com/fwlink/?LinkId=254725  
    public static void RegisterBundles(BundleCollection bundles)  
    {  
        bundles.Add(new ScriptBundle("~/bundles/jquery").Include(  
                    "~/Scripts/jquery-{version}.js"));  
                    
    // Use the development version of Modernizr to develop with and learn from. Then, when you're  
    // ready for production, use the build tool at http://modernizr.com to pick only the tests you need.  
    bundles.Add(new ScriptBundle("~/bundles/modernizr").Include(  
                "~/Scripts/modernizr-*"));  

    bundles.Add(new StyleBundle("~/Content/css").Include("~/Content/site.css"));  

    bundles.Add(new StyleBundle("~/Content/themes/base/css").Include(  
                "~/Content/themes/base/jquery.ui.core.css",  
                "~/Content/themes/base/jquery.ui.resizable.css",  
    }  
 } 

Bundle 在 Application_Start() 方法内的 Global.asax 文件中注册:

using System.Web.Optimization;

protected void Application_Start() 
{
    BundleConfig.RegisterBundles(BundleTable.Bundles);
}

绑定包应该在你的视图中呈现为:

@using System.Web.Optimization

@Scripts.Render("~/bundles/jquery")
@Scripts.Render("~/bundles/modernizr")
@Styles.Render("~/Content/css") 
@Styles.Render("~/Content/themes/base/css") 

请注意,当你处于开发模式(Web.config 文件中的编译元素设置为 debug =true)时,不会发生绑定。相反,视图中的 Render 语句将以非绑定的非缩小格式包含每个单独的文件,以便于调试。

一旦应用程序处于生产模式(Web.config 文件中的编译元素设置为 debug =false),将进行绑定。

这可能导致引用其他文件的相对路径的脚本的复杂性,例如对 Twitter Bootstrap 的图标文件的引用。这可以通过使用 System.Web.Optimization 的 CssRewriteUrlTransform 类来解决:

 bundles.Add(new StyleBundle("~/bundles/css").Include(
                "~/Content/css/*.css", new CssRewriteUrlTransform()));

CssRewriteUrlTransform 类将绑定文件中的相对 Urls 重写为绝对路径,以便在将调用引用移动到 bundle 的位置后引用将保持不变(例如,使用上面的代码,从“〜/ Content / css /”移动 bootstrap.cssto〜/ bundles / css / bootstrap.css“)。