的Visual Studio 2012的条件捆绑 [英] Visual Studio 2012 Conditional Bundling

查看:134
本文介绍了的Visual Studio 2012的条件捆绑的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

我刚开始用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 method Application_Start contains following line:

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

Find or create class BundleConfig as follows, preferrably in folder App_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, but aspx 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屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆