`
bellstar
  • 浏览: 150596 次
  • 性别: Icon_minigender_1
  • 来自: 上海
社区版块
存档分类
最新评论

使用指令处理JS、CSS、PNG文件

阅读更多
使用yui的压缩工具压缩JS和CSS
http://developer.yahoo.com/yui/compressor/
yuicompressor.jar这个文件要和ymin这个文件放在一个目录下。
ymin的代码如下
#!/bin/sh
#filename=ymin
basedir=$(dirname $0)
jsmin="java -jar $basedir/yuicompressor.jar --type js" 
cssmin="java -jar $basedir/yuicompressor.jar --type css" 
for f in $*; do
	case $f in
		*.source.js)
			n=`echo $f | sed s/.source.js$//`
			$jsmin $f -o $n.js ;;
		*.js)
			n=`echo $f | sed s/.js$//`
			$jsmin $f -o $n-min.js ;;
		*.source.css)
			n=`echo $f | sed s/.source.css$//`
			$cmd;$cssmin $f -o $n.css ;;
		*.css)
			n=`echo $f | sed s/.css$//`
			$cssmin $f -o $n-min.css ;;
		*)
			find $f -exec ymin {} ';';;
	esac
done


使用示例
ymin a.js
#生成 a-min.js
ymin a.source.js
#生成 a.js
ymin *.js
#依上两个规则批量处理find *.js查找到文件

压缩CSS就 不举例了


使用javascript lint检查js文件
http://www.javascriptlint.com/
mac用户可使用brew install jsl安装
#!/bin/sh 
#filename=jslt
option="-nologo"
for f in $*; do
	case $f in
		*.js)
			jsl $option -process $f;;
		-*)
			option="$option $f";;
		*)
			find $f -exec jsl $option {} ';';;
	esac
done


使用示例
jslt a.js
jslt *.js
jslt -nocontext *.js


使用PNGOUT压缩文件
http://advsys.net/ken/utils.htm
这个只列下帮助吧,我没有用SHELL再包了

$ pngout --help
Warning: unrecognized option: --help
Must specify a source or target image
PNGOUT [In:{PNG,JPG,GIF,TGA,PCX,BMP}] (Out:PNG) (options...)        Jul 22 2011
by Ken Silverman (http://advsys.net/ken)
Mac port assistance by Jonathon Fowler (http://www.jonof.id.au/pngout)
PNGOUT optimizes PNG size losslessly using my own deflate algorithm (not Zlib)
With the right options, it can often beat other programs by 5-10%. Options:
   -c# PNG output color: 0=Gray, 2=RGB, 3=Pal, 4=Gray+Alpha, 6=RGB+Alpha
   -f# PNG output filter: 0=none, 1=x, 2=y, 3=x&y, 4=Paeth, 5=mixed, 6=reuse
   -d# Override default bitdepth: 0(min),1,2,4,8 (valid only in /c0,/c3 modes)
   -s# Select strategy. 0:Xtreme(default), 1:Intense, 2:Longest Match,
       3:Huffman Only, 4:Uncompressed
   -b# Block split threshold (lower=more blocks, 0=1 block/file, default=256)
       Use trial&error! Suggested values to try are: 0,128,192,256,512,1024,..
   -n# Exact number of Huffman blocks (overrides /b#)
   -r  Randomized initial tables (good for many trials with same options)
   -k? 0=Remove optional chunks (default), 1=Keep all
       p=Keep palette indices, s=Keep settings for /c,f,d,b
   -k(Chunk,Chunk,..) Preserve only named chunk(s). Example: -kgAMA,bKGD,tEXt
   -v,q,l Verbose,Quiet,List mode (use '-' as filename to specify stdin/stdout)
   -y  Assume Yes at the 'overwrite file?' prompt
   -force  Write file even if bigger.
   -mincodes#  Workaround for buggy decoders. 1:Zlib 1.2.1 bug, 2:buggy mobiles
The 1st filename is the input. If you omit the output
filename, PNGOUT will use the same filename with a .PNG extension. Examples:
   $ pngout inlarge.bmp outsmall.png           <- writes outsmall.png
   $ pngout duke3d.png -c2 -f3 -b128 -kbKGD -v <- writes duke3d.png if smaller

分享到:
评论

相关推荐

    DIV手工打造云台控制组件,适用场景广泛。八方向云台控制,近焦远焦控制,放大缩小控制html5 CSS.zip

    3. "1.html", "2.css", "3.js" 等未完全列出的文件,可能是组件的其他组成部分,"1.html" 通常是主页面文件,"2.css" 是样式表文件,定义了组件的外观,而"3.js" 很可能是包含组件逻辑的JavaScript脚本。 在开发...

    最好的IE6下png透明图片修复代码

    然后,为需要修复的PNG图片元素添加特定的CSS类或者JavaScript处理: ```css img.myPNGFix { behavior: url/DD_belatedPNG_0.0.8a.min.htc; } ``` 或 ```javascript DD_belatedPNG.fix('img.myPNGFix'); ``` 这里...

    网站抓取精灵(一键抓取图片,样式,JS文件)

    再者,"外部js文件的抓取限制"的修正意味着软件现在可以更全面地处理JavaScript资源。在抓取过程中,外部JavaScript文件往往包含重要功能和数据,新版解决了抓取限制,使用户能够获取完整的网页交互逻辑。 最后,...

    nginx访问静态文件不下载.rar

    标题 "nginx访问静态文件不下载" 暗示了用户可能遇到了在使用Nginx服务器时,尝试访问静态文件(如HTML、CSS、JavaScript或图片等)却导致浏览器下载文件而不是正常显示的情况。Nginx是一款高性能的HTTP和反向代理...

    基于AutoGen代理框架的Agent-E浏览器自动化设计源码

    该项目是一款基于AutoGen代理框架构建的Agent-E自动化系统源码,涵盖150个文件,包括50个Python脚本、13个JavaScript文件、11个HTML、CSS和TXT文件、9个PNG图像文件,以及多种格式文件。Agent-E通过自然语言处理技术...

    基于Python的家庭语音控制机器人设计源码

    集成了Python、HTML、JavaScript、CSS、Shell等多种编程语言,共计189个文件,涵盖59个Python脚本、21个HTML文件、16个图片文件(PNG、JPG、JPEG)、10个JavaScript文件、7个CSS样式文件、4个WAV音频文件、3个文本...

    所有文件后缀名大全.doc

    18. **.js**: JavaScript 文件,用于网页和应用程序的客户端脚本语言。 19. **.exe**: Windows 平台上可执行的程序文件。 20. **.apk**: Android 应用程序包,用于安装在 Android 设备上。 这只是众多文件后缀名...

    导出打印嵌套svg网页

    总之,导出和打印嵌套SVG的网页涉及到多个技术层面,包括SVG到canvas的转换、PNG导出、CSS媒体查询以及JavaScript打印功能的实现。理解并掌握这些技术,对于开发响应式、多平台兼容的网页至关重要,能够帮助提升用户...

    点击图片上传并显示(弹性盒布局,包含html版本和vue版本)

    在Vue实例中,可以定义数据属性(如`files`)来存储上传的图片信息,并创建方法(如`uploadFiles`)来处理文件选择事件。使用`v-for`指令可以方便地遍历图片数组并渲染每个图片。Vue的响应式系统使得数据的变化能够...

    vuejs_animals_动画特效_vuejs_鼠标悬停_

    - `app.js`:Vue实例和相关方法的JavaScript文件。 - `styles.css`:包含动画效果的CSS文件。 - `animal.png`:动物图像资源。 通过以上步骤,我们可以创建一个基于Vue.js的鼠标悬停动画特效,使网页交互更加有趣。...

    基于vue上传的图片例子,支持传多图文件,支持拖拽上传图片,支持手机上传,pc上传。

    使用CSS媒体查询或Vue的`v-if`、`v-show`指令,确保在不同设备(PC和手机)上的布局和交互体验都良好。 在提供的文件列表中,`index.html`是应用的入口文件,它包含Vue应用的HTML结构;`upload.png`和`del.png`...

    vue樱花漫天效果文件

    在“vue樱花漫天效果文件”这个项目中,我们主要关注的是如何使用Vue.js来实现一种动态视觉效果——樱花飘落的场景。这通常涉及到Vue的基本组件创建、动画处理以及图像渲染等方面的知识点。 首先,我们要理解Vue...

    百度Web Uploader组件实现文件上传(一)

    1. 引入资源:在HTML文件中引入Web Uploader的CSS和JS文件,通常包括`uploader.css`和`webuploader.js`。 2. 初始化组件:在JavaScript中,通过`WebUploader.create()`方法初始化组件,设置配置项,如选择文件的...

    asp.net 到顶部底部(封装用户控件)

    这两个按钮可能通过CSS样式文件(例如,3.png、2.png、scroll.png等图片资源)进行美化,并利用JavaScript库如jQuery来处理点击事件和页面滚动行为。 `Scroll.ascx.designer.cs`是Visual Studio自动生成的代码文件...

    nginx发布前端静态文件配置

    location ~* \.(jpg|jpeg|png|gif|ico|css|js)$ { expires 1y; add_header Cache-Control "public"; } ``` 这将设置一年的有效期,并告知浏览器这些资源可以被公共缓存。 7. **安全考虑**: 考虑添加HTTP到...

    飞得更高游戏源码.zip

    通过分析这些文件,我们可以了解到游戏的前端架构,包括如何使用HTML和CSS构建界面,以及如何用JavaScript处理用户交互和游戏逻辑。同时,源码还可能涉及到动画处理、游戏循环、分数计算、碰撞检测等关键游戏开发...

    [聊天留言]Eron留言本_jspbook.rar

    4. **JavaScript文件**:可能包含`.js`文件,负责客户端的交互和验证。 5. **数据库连接和配置**:可能有数据库配置文件(如`.properties`或`.xml`),用于存储数据库连接信息。 6. **图片和其他静态资源**:如`....

    Web前端优化最佳实践及工具集锦

    在JavaScript中使用`document.write` 来插入内容或调用外部资源时,浏览器需要额外的步骤来处理这些指令,导致页面加载速度变慢。 **解决方法:** - **操作步骤:** 将所有`document.write` 调用替换为HTML标签直接...

    html2canvas实现将dom生成图片并保存至本地

    这个过程包括解析CSS样式、处理布局、绘制文本、图像等内容。由于浏览器对跨域图像和某些CSS属性的支持限制,HTML2canvas可能无法完美地复制所有网页元素,但大部分常见情况下的截图效果是相当不错的。 二、使用...

Global site tag (gtag.js) - Google Analytics