Visual Studio中编译任务压缩js和CSS文件

开发 后端
大部分网站都在说优化,压缩js和css文件就成了最基本的一种方法,js和CSS压缩有很多方法,很多网站也提供了这样的功能,也可以用YUI提供的包手动压缩,但是这都不效率啊,能不能在vs生成部署包的时候把js和css压缩好呢?当然可以。

首先请下载YUI Compressor,YUI Compressor是个Java库,你需要安装Java的运行环境,请点这里下载。(关于Java环境的配置请大家自行google,另外YUI Compressor是github的链接,应该被墙了,请自备爬梯工具)。

新建一个批处理文件,代码如下:

  1. @echo off 
  2. if "%1" == "" goto exit 
  3. if "%2" == "" goto exit 
  4. pushd "%1" 
  5. echo 正在压缩Css文件 
  6. for /r %%i in (*.css) do call "D:\Program Files\Java\jre\bin\java.exe" -jar G:\tools\yuicompressor-2.4.7.jar -o %%i %%i 
  7. echo 正在压缩js文件 
  8. for /r %%i in (*.js) do call "D:\Program Files\Java\jre\bin\java.exe" -jar G:\tools\yuicompressor-2.4.7.jar -o %%i %%i 
  9. ::call "D:\Program Files\7-Zip\7z.exe" a %2.7z -r PackageTmp 
  10. pause 
  11. :exit 
  12. exit 

批处理的第一个参数接收项目生成部署包的路径,vs默认路径是:\obj\Release,第二个参数是生成压缩包的名字(这里是生成的7z的压缩包,如果需要生成,请把call那行的注释去掉)。

然后就是编辑你的项目文件,比如Test.csproj,打开它,在根路径下添加如下代码:

  1. <Target Name="Compressor" BeforeTargets="Package" Condition="'$(ConfigurationName)'=='Release'"> 
  2.     <Message Text="Starting Compress Javascript Files and Css Files" /> 
  3.     <Exec Command="call F:\Users\Documents\Compressor.bat $(ProjectDir)obj\$(ConfigurationName)\Package\ $(ProjectName)" /> 
  4. </Target> 

稍微解释下这段代码,BeforeTargets="Package"是在打包Web文件前调用压缩,Condition="'$(ConfigurationName)'=='Release'",只有Release模式下才压缩,你不会想一边Debug一边压缩js和css文件吧。Command命令中,请自行替换刚才建立的批处理文件的路径,$(ProjectDir)是项目路径,$ConfigurationName是当前的生成配置,$ProjectName是项目名称。

现在在项目上右击,生成部署包,然后看看js和css文件是不是都已经压缩了呢?

原文链接:http://www.cnblogs.com/darkiller/archive/2013/01/31/2887235.html

【编辑推荐】

责任编辑:彭凡 来源: 博客园
相关推荐

2011-02-28 10:27:41

Visual Stud

2011-03-28 09:23:31

Visual Stud

2010-05-14 15:05:38

Visual Stud

2012-03-26 10:45:34

CSS

2013-11-14 01:09:35

微软Visual StudVisual Stud

2023-09-05 07:32:22

vscode开源故障

2024-02-27 12:42:38

开发前端

2009-09-02 16:21:17

Visual BasiC#语言

2012-03-27 09:42:57

JavaScriptCSS

2009-10-14 09:08:23

Visual Stud

2011-08-29 10:11:49

QTWindowsVisual Stud

2009-06-16 10:44:50

JS代码折叠Visual Stud

2011-03-08 10:18:18

Visual StudMongoDB

2009-07-01 16:36:40

CSS样式工具Visual Stud

2011-03-01 08:47:40

Visual Stud

2011-05-25 16:44:01

JavaScriptCSS

2020-09-22 07:35:42

Node.jsVue.js文件压缩

2009-07-01 17:04:13

ListViewVisual Stud

2011-01-10 08:48:53

2014-02-14 10:48:32

Visual StudNode.js
点赞
收藏

51CTO技术栈公众号