【NodeCC】NodeJs开发的脚本压缩和combo工具

对于Web前端的开发而言,为了降低文件大小,js文件和css文件的压缩和组合几乎是默认的规矩。

我们利用YUI Compressor 和 google Compiler 可以很容易的完成文件的压缩。 甚至 yui compressor 本身都已经支持 多文件的批量压缩。

但是,为了更好的处理这些机械化的事情,我们通常还是需要脚本来辅助,让这些工作可以更好的自动化,可配置化。

网上有很多类似的脚本工具,或者有的也已经编译成了可视化的工具来使用。

我自己以前也写过python版本的,也用过同事写的类似的脚本,基本也都是python版本的。鉴于大多数前端的攻城师们对js更为熟悉,所以,这里也提供一个简易的nodejs 版本的。下午花了3个小时写的。

NodeCC –> Node Compressor and Comboer

代码很简单,基本就是读文件,写文件,调用系统jar命令 使用 yuicompressor 压缩文件。
源码托管在:github.com/hongru/nodeCC 上,100行左右。

编码中需要注意的几个地方:

nodejs中fileSystem buffer的概念,简单的可以理解成文本数据流,所以,为了得到我们常见的文本,注意 readFile 后 toString的使用。
生成新文件时,路径是否存在的判断,如果不存在,生成指定目录时,由于node本身的mkdir不支持多级目录,所以这里需要自己来处理多级目录的递归生成。
有两种方式,一种是利用child_process 创建一个子进程调用系统命令 mkdir -p.
另一种就是分析路径,一级一级递归创建目录。代码参考 https://gist.github.com/2817910
双击选中源代码
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
/* mkdir -p for node */
var fs = require('fs'),
path = require('path');

function mkdirpSync (pathes, mode) {
mode = mode || 0777;
var dirs = pathes.trim().split('/');
if (dirs[0] == '.') {
// ./aaa
dirs.shift();
}

if (dirs[0] == '..') {
// ../aaa
dirs.splice(0, 2, dirs[0] + '/' + dirs[1]);
}

dirs.length && mkdir(dirs.shift());
// mkdir
function mkdir (d) {
if (!path.existsSync(d)) {
fs.mkdirSync(d, mode);
}

dirs.length && mkdir(d + '/' + dirs.shift());
}
}

// eg
//mkdirpSync('hongru/me');
通过child_process 的spawn 来调用系统命令,比如 ls, java 等。然后通过stdout 和 stderr 来监听获得 命令所返回的log或者error信息。
【使用方法】

当然,因为是nodejs版本的,所以自然需要安装nodejs,官方有提供详细说明
因为用了jar包 yuicompressor.jar, 所以,需要安装 JAVA的sdk,安装过程也很简单,不会的搜一下即可。
最后,关于config.json 文件的配置,很简单,都是两个字段,“source”和“target”,source代表源路径文件,target表示压缩之后生成的文件路径。
支持目录级别。
另外,如果source字段为一个数组的话,会将这个数组里面的文件按照顺序合并,然后压缩生成到指定target的路径。所以,config.json看起来会像是这个样子:
双击选中源代码
{
"css-test": {
"source": "test/css/",
"target": "test/public/css/"
},
"normal-file-compress": {
"source": "test/test.js",
"target": "test/test.min.js"
},
"normal-dir-compress": {
"source": "test/js/",
"target": "test/public/js/"
},
"compress-and-merge": {
"source": [
"test/js/a.js",
"test/js/b.js"
],
"target": "test/public/js/ab.js"
}
}
将带有 yuicompressor.jar 的tools/ ,主脚本 nodecc.js, 以及配置好的config.json 放置在同一目录下,然后执行
双击选中源代码
1
node nodecc.js
即可。

好了,工具很简单,代码也很简单,希望能给有需要的同学提供一点点帮助


http://www.alloyteam.com/2012/05/nodecc-version-of-nodejs-script-compression-and-compo-tools/#more-1368
  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值