我们先来简单看看我们熟悉的ASP。净MVC中是如何管理我们项目中的这些静态文件呢?
其实当我们新建一个MVC的项目时,已经生成了一个“模板”让我们参考,
这个“模板”就是App_Start下面的BundleConfig。cs
1 public class BundleConfig 2 { 3 // For more information on bundling, visit http://go.microsoft.com/fwlink/?LinkId=301862 4 public static void RegisterBundles(BundleCollection bundles) 5 { 6 bundles.Add(new ScriptBundle("~/bundles/jquery").Include( 7 "~/Scripts/jquery-{version}.js")); 8 bundles.Add(new ScriptBundle("~/bundles/jqueryval").Include( 9 "~/Scripts/jquery.validate*"));10 // Use the development version of Modernizr to develop with and learn from. Then, when you're11 // ready for production, use the build tool at http://modernizr.com to pick only the tests you need.12 bundles.Add(new ScriptBundle("~/bundles/modernizr").Include(13 "~/Scripts/modernizr-*"));14 bundles.Add(new ScriptBundle("~/bundles/bootstrap").Include(15 "~/Scripts/bootstrap.js",16 "~/Scripts/respond.js"));17 bundles.Add(new StyleBundle("~/Content/css").Include(18 "~/Content/bootstrap.css",19 "~/Content/site.css"));20 }21 }
它位于System.Web.优化程序集,如果想要用这个功能,记得添加引用喔!
那我们要怎么使用这个呢?
现在假设在根目录下面有css和js两个文件夹,里面分别存放着Style1.css, Style2.css和js1.js, js2。js
下面就来看看怎么把它交于Bundle管理
1 bundles.Add(new ScriptBundle("~/bundles/js").Include(2 "~/js/js1.js",3 "~/js/js2.js"));4 bundles.Add(new StyleBundle("~/bundles/css").Include(5 "~/css/Style1.css",6 "~/css/Style2.css"));
其中的“~/bundles/js”和"~/bundles/css"是虚拟路径!
然后就是在页面中使用(就是用我们刚才的虚拟路径)
1 @Styles.Render("~/bundles/css")2 @Scripts.Render("~/bundles/js")