ASP.NET下使用COMBRES对JS、CSS动态合并和压缩

[文章] 浏览(8) | 2017年10月30日 | 支持服务 |

【标签】软件开发,C#,Asp.Net

https://github.com/buunguyen/combres

支持：

ASP.NET
3、5-
4、5

ASP.NET MVC 2-5

同时使用：

dotless
1、
4、
1、0

YUICompressor.NET
2、
7、
0、0

AjaxMin
5、
14、
5506、26202

第一步：
安装（通过NuGet添加combres）

VS2012及以上版本

1、NuGet管理

工具-NuGet管理-在线

过滤：
combres

找到combres，点击-安装

2、工具-NuGet命令

ASP.NET
安装：
PM> Install-Package combres

ASP.NET MVC
安装：
PM> Install-Package Combres.Mvc

完成之后在web根下会生成一个combres.readme，请先阅读。

在web\bin
下引入：

Combres.dll

Combres.xml

dotless.Core.dll

Yahoo.Yui.Compressor.dll

AjaxMin.dll

fasterflect.dll

fasterflect.xml

WebActivatorEx.dll 依赖 Microsoft.Web.Infrastructure.dll

在Web\App_Data
下生成：

combres.xml

combres_full_with_annotation.xml

combres_minimal.xml

网站配置web\web.config
相关项：

<?xml version="
1、0"?>
<configuration>
  <configSections>
    <section name="dotless" type="dotless.Core.configuration.DotlessConfigurationSectionHandler, dotless.Core"/>
    <section name="combres" type="Combres.ConfigSectionSetting, Combres"/>
  </configSections>
  <appSettings>
    <add key="CombresSectionName" value="combres"/>
  </appSettings>
  <system.web>
    <pages validateRequest="false" maxPageStateFieldLength="2048" controlRenderingCompatibilityVersion="
4、0">
      <namespaces>
        <add namespace="Combres"/>
      </namespaces>
      <controls>
        <add tagPrefix="ajaxToolkit" assembly="AjaxControlToolkit" namespace="AjaxControlToolkit"/>
      </controls>
    </pages>
    <httpHandlers>
      <add path="*.less" verb="GET" type="dotless.Core.LessCssHttpHandler, dotless.Core"/>
    </httpHandlers>
  </system.web>
  <system.webServer>
  <handlers>
      <add name="dotless" path="*.less" verb="GET" type="dotless.Core.LessCssHttpHandler,dotless.Core" resourceType="File" preCondition=""/>
    </handlers>
  <combres definitionUrl="~/App_Data/combres.xml"/>
</configuration>

第二步：
编辑App_Data/combres.xml文件，添加所要用的JS 和 CSS

例子：

<?xml version="
1、0" encoding="utf-8" ?>
<!--
  This file contains basic settings needed for most web apps.
  For full Combres settings (with explanation), refer to the sample definition file: combres_full_with_annotation.xml
  Also, refer to Combres' documentation: http://combres.codeplex.com/documentation    
-->
<combres xmlns='urn:combres'>
  <filters>
    <filter type="Combres.Filters.FixUrlsInCssFilter, Combres" />
  </filters>
  <!--
    defaultDuration 默认缓存的时间，单位为天数。
    defaultVersion 合并后的资源版本，在你修改了资源文件后需要对版本进行修改，你可以指定auto或者手动设置一个版本号。
    defaultDebugEnabled true：对资源文件不压缩；false:对资源文件压缩。
  -->
  <resourceSets url="~/combres.axd"
                defaultDuration="30"
                defaultVersion="auto"
                defaultDebugEnabled="false" 
                defaultIgnorePipelineWhenDebug="true"
                localChangeMonitorInterval="30"
                remoteChangeMonitorInterval="60"
                >
    <resourceSet name="siteCss" type="css">
      <resource path="~/Style/css/style.css" />
    </resourceSet>
    <resourceSet name="siteJs" type="js">
      <resource path="~/Script/jquery-
1、
7、
2、js" />
     </resourceSet>
  </resourceSets>
</combres>

第三步（页面使用）

Html页面 default.aspx

<%@ Page Language="C#" CodeFile="default.aspx.cs" Inherits="_default"%>
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head id="Head1" runat="server">
    <meta charset="utf-8" />
    <title>default</title>
    <asp:PlaceHolder ID="phHeadScript" runat="server"></asp:PlaceHolder>
</head>
...

后台 default.aspx.cs

using Combres;
...
public partial class _default: System.Web.UI.Page
{
        // using Combres; 前台无须引用 <%@ Import Namespace="Combres" %> 因Combres名字空间是全局的
        htm.Text = WebExtensions.CombresLink("siteCss");
        htm.Text += WebExtensions.CombresLink("siteJs");
        phHeadScript.Controls.Clear();
        phHeadScript.Controls.Add(htm);
}

呈现Html页面

<head id="Head1">
    <meta charset="utf-8">
    <title>default</title>
    <link rel="stylesheet" type="text/css" href="/combres.axd/siteCss/-794726367/">
    <script type="text/javascript" src="/combres.axd/siteJs/1123579001/"></script>
</head>
...