2012-01-29 129 views
8

我希望能夠在我的項目文件夾中運行一個命令,將所有的JavaScript文件(可能與YUI壓縮器)連接並壓縮到一個輸出文件中。遞歸壓縮JavaScript文件的目錄到一個文件

如果可能,我想部分指定它們連接在一起的順序,但不必跟蹤每一個JavaScript文件。也許一個配置文件可以建立它看起來像這樣:

application.js 
excanvas.js 
json2.js 
jquery*.js 
flot/* 
backbone*.js 
app/screen-*.js 
app/main.js 
app/crud-*.js 
app/* 
* 

有誰知道一個現有的工具做這樣的事情的,可能會掀起一起慶典/紅寶石/節點/ perl腳本,甚至更好方法?我正在構建一個單頁面應用程序,它使用JS(約40個文件)的重量,供低帶寬用戶使用。

我需要的解決方案可以在我的OS X開發機器上執行。

回答

0

我最終的建築,使用JSON文件列出所有應用程序所需的全部文件的解決方案的模式。在開發環境中,文件由瀏覽器單獨加載。在生產服務器上,加載大編譯文件。在我的開發機器上,我手動運行一個命令遍歷每個文件,將它附加到一個大的JS文件並運行YUI Compressor。

這是一個小哈克,但在這裏它是: https://github.com/renownedmedia/js-compressor

+0

鏈接給我404 – Lucio 2014-01-29 02:26:30

3
find . -iname "*.js" -exec cat "{}" \; > singlefile.js 
[JS compressor] singlefile.js 

首先連接文件,然後壓縮它們。

如果你真的在乎,你可能需要一個像RequireJS優化器這樣的真正的JS優化器。

0

下面的腳本將按照您的配置文件的順序和使用給予

#!/bin/bash 

shopt -s nullglob; 
while read config; do 
    cat $config >> out.js 
done < /path/to/config/file 
2

給出的JavaScript文件的文件夾:

geee: ~/src/bash/js-files 
$ find . 
. 
./application.js 
./jquery-ui.js 
./all-scripts.js 
./cp.js 
./excanvas.js 
./backbone-worldwide.js 
./jquery-plugin.js 
./.found 
./app 
./app/crud-sel.js 
./app/screen-detach.js 
./app/aligator.js 
./app/crud-in.js 
./app/giraffe.js 
./app/screen-attach.js 
./app/main.js 
./app/crud-del.js 
./app/mouse.js 
./app/monkey.js 
./app/screen-shot.js 
./backbone-national.js 
./backbone23.js 
./ummap.js 
./CONFIG 
./backbone-ibm.js 
./ieee754.js 
./flot 
./flot/cow.js 
./flot/moo.js 
./flot/cat.js 
./flot/bull.js 
./flot/dog.js 
./flot/sheep.js 
./lines 
./droiddraw-r1b21 
./droiddraw-r1b21/._readme.txt 
./droiddraw-r1b21/readme.js 
./droiddraw-r1b21/LICENSE.js 
./jquery-1.7.js 
./ole.js 
./touch 
./json2.js 
./xls2txt.js 
./DO.sh 
./backbone-isp.js 

有稍微修改配置文件:

geee: ~/src/bash/js-files 
$ cat CONFIG 
application.js 
excanvas.js 
json2.js 
jquery*.js 
flot/* 
backbone*.js 
app/screen-*.js 
app/main.js 
app/crud-*.js 
app/*js 
*js 

這bash腳本:

$ cat DO.sh 
PROJECT=/home/jaroslav/src/bash/js-files  # top folder of the web-app 
SUPERJS=${PROJECT}/all-scripts.js 
CONFIG=${PROJECT}/CONFIG      # your the priority file (notice *js) 
FOUND=${PROJECT}/.found       # where to save results 
JSMIN=$HOME/bin/jsmin       # change to /usr/local/bin/jsmin or some other tool 

echo > $FOUND         # remove results from previous run 

if [ ! -x $JSMIN ] 
then 
     TMPJSMIN=/tmp/jsmin.c 
     wget -q https://github.com/douglascrockford/JSMin/raw/master/jsmin.c -O $TMPJSMIN & FOR=$? 
     echo "fetching jsmin (by Douglas Crockford) from github" 
     wait $FOR 
     gcc -o $JSMIN $TMPJSMIN 
fi 




cat $CONFIG | \ 
     while read priority 
     do 
       eval "find $priority|sort -n" | \ 
         while read amatch; 
         do 
           grep -q $amatch $FOUND || echo $amatch >> $FOUND 
         done 
     done 
echo minifying: 
cat $FOUND 
cat `cat $FOUND` | $JSMIN > $SUPERJS 

,你會發現「合併」的腳本在所有的腳本乳寧後腳本:

geee: ~/src/bash/js-files 
$ . DO.sh 
fetching jsmin (by Douglas Crockford) from github 
[1]+ Done     wget -q https://github.com/douglascrockford/JSMin/raw/master/jsmin.c -O $TMPJSMIN 
minifying: 

application.js 
excanvas.js 
json2.js 
jquery-1.7.js 
jquery-plugin.js 
jquery-ui.js 
flot/bull.js 
flot/cat.js 
flot/cow.js 
flot/dog.js 
flot/moo.js 
flot/sheep.js 
backbone23.js 
backbone-ibm.js 
backbone-isp.js 
backbone-national.js 
backbone-worldwide.js 
app/screen-attach.js 
app/screen-detach.js 
app/screen-shot.js 
app/main.js 
app/crud-del.js 
app/crud-in.js 
app/crud-sel.js 
app/aligator.js 
app/giraffe.js 
app/monkey.js 
app/mouse.js 
all-scripts.js 
cp.js 
ieee754.js 
ole.js 
ummap.js 
xls2txt.js 

讓我知道,如果你需要我解釋腳本或者未能在OS X