的Visual Studio 2012的条件捆绑 [英] Visual Studio 2012 Conditional Bundling
问题描述
我刚开始用VS 2012 RC的工作。我创建了一个测试站点母版页和一个Web表单。该网站上目前,我用这个code捆绑整个样式
文件夹:
的Global.asax
BundleTable.Bundles.EnableDefaultBundles();
Site.master母
<链接rel =stylesheet属性类型=文/ CSS的href =样式/ CSS/>
问:测试场地具有控制网站的整体外观站点级别的CSS文件。除了在站点级别的CSS,每个页面的可能的有自己的CSS定义。文件作为每个页面需要的是有可能包括在母版页只有的site.css
文件,然后有条件添加的.css将捆绑?
我在code试过这种 Default.aspx的
的落后,但它没有工作:
BundleTable.Bundles.Add(新包(〜/风格/ Default.css));
我的建议是:
转到的Global.asax
。确保方法的Application_Start
包含以下行:
保护无效的Application_Start()
{
...
BundleConfig.RegisterBundles(BundleTable.Bundles);
}
查找或创建类 BundleConfig
如下,$ P文件夹pferrably $ App_Start
:
公共类BundleConfig
{
公共静态无效RegisterBundles(BundleCollection包)
{
... bundles.Add(新StyleBundle(〜第1页)。包括(
〜/风格/的site.css
〜/风格/ page1.css)); bundles.Add(新StyleBundle(〜第2页)。包括(
〜/风格/的site.css
〜/风格/ page2.css)); ... bundles.Add(新StyleBundle(〜PAGEN)。包括(
〜/风格/的site.css
〜/风格/ pageN.css)); }
}
现在使用相应的捆绑在每一个相应的页面:
<链接rel =stylesheet属性类型=文/ CSS的href =样式/第1页/>
或从code更好的:
@ Styles.Render(〜/风格/第1页)
(这是 CSHTML
,但 ASPX
语法是肯定的非常相似)。
请注意,您必须拥有每页的一个单独的包。你不应该修改之一,并在飞行中同捆。束具有虚拟URL。在你的榜样,它仅仅是
CSS
。这是由浏览器缓存,所以不管天气已经改变了包内容的飞行浏览器可能会认为这是相同的,不要再拿来。
块引用>如果你不想把有关手动添加每一个网页上面的方法治疗。你可以自动化。继code可以给你一个想法如何:
公共类MyStyleHelper
{
公共静态字符串RenderPageSpecificStyle(字符串PAGEPATH)
{
VAR页面名= GetPageName(PAGEPATH);
串束名称= EnsureBundle(页面名);
返回束名称;
} 公共静态字符串GetPageName(字符串PAGEPATH)
{
字符串pageFileName = pagePath.Substring(pagePath.LastIndexOf('/'));
字符串pageNameWithoutExtension = Path.GetFileNameWithoutExtension(pageFileName);
返回pageNameWithoutExtension;
} 公共静态字符串EnsureBundle(字符串页面名)
{
VAR束名称=〜/风格/+页面名;
VAR包= BundleTable.Bundles.GetBundleFor(束名称);
如果(丛== NULL)
{
捆绑=新StyleBundle(束名称).INCLUDE(
〜/风格/的site.css
〜/风格/+页面名称+的CSS);
BundleTable.Bundles.Add(包);
}
返回束名称;
}
}用法:
<链接rel =stylesheet属性类型=文/ CSS的href =<%:MyStyleHelper.RenderPageSpecificStyle(Page.Ap prelativeVirtualPath)%GT; />
I just began working with VS 2012 RC. I've created a test site with a master page and a single web form. Currently, I'm using this code to bundle the entire
Styles
folder on the site:Global.asax
BundleTable.Bundles.EnableDefaultBundles();
Site.master
<link rel="stylesheet" type="text/css" href="Styles/css" />
Question: The test site has a site-level CSS file that controls the overall look and feel of the site. In addition to the site-level CSS, each page could have their own CSS definitions. Is it possible to include only the
site.css
file in the master page, and then conditionally add .css files to the bundle as each page requires?I tried this in the code behind of
Default.aspx
but it didn't work:BundleTable.Bundles.Add(new Bundle("~/Styles/Default.css"));
解决方案My suggestion:
Goto
Global.asax
. Ensure the methodApplication_Start
contains following line:protected void Application_Start() { ... BundleConfig.RegisterBundles(BundleTable.Bundles); }
Find or create class
BundleConfig
as follows, preferrably in folderApp_Start
:public class BundleConfig { public static void RegisterBundles(BundleCollection bundles) { ... bundles.Add(new StyleBundle("~page1").Include( "~/Styles/site.css", "~/Styles/page1.css")); bundles.Add(new StyleBundle("~page2").Include( "~/Styles/site.css", "~/Styles/page2.css")); ... bundles.Add(new StyleBundle("~pageN").Include( "~/Styles/site.css", "~/Styles/pageN.css")); } }
Now use corresponding bundle in every appropriate page:
<link rel="stylesheet" type="text/css" href="Styles/page1" />
Or better from code:
@Styles.Render("~/Styles/page1")
(this is
cshtml
, butaspx
syntax is for sure very similar).Note that you must have a separate bundle per page. You should not modify one and the same bundle on the fly. Bundles have virtual Urls. In your example it is just
css
. These are cached by browsers, so regardless weather you have changed the content of bundle on the fly a browser might think this is the same and do not re-fetch it.
If you do not want to take care about adding each and every page manually to the method above. You could automate it. Following code could give you an idea how:
public class MyStyleHelper { public static string RenderPageSpecificStyle(string pagePath) { var pageName = GetPageName(pagePath); string bundleName = EnsureBundle(pageName); return bundleName; } public static string GetPageName(string pagePath) { string pageFileName = pagePath.Substring(pagePath.LastIndexOf('/')); string pageNameWithoutExtension = Path.GetFileNameWithoutExtension(pageFileName); return pageNameWithoutExtension; } public static string EnsureBundle(string pageName) { var bundleName = "~/styles/" + pageName; var bundle = BundleTable.Bundles.GetBundleFor(bundleName); if (bundle == null) { bundle = new StyleBundle(bundleName).Include( "~/styles/site.css", "~/styles/" + pageName + ".css"); BundleTable.Bundles.Add(bundle); } return bundleName; } }
Usage:
<link rel="stylesheet" type="text/css" href="<%: MyStyleHelper.RenderPageSpecificStyle(Page.AppRelativeVirtualPath) %>" />
这篇关于的Visual Studio 2012的条件捆绑的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!