uglifyjs壓縮js文件(指令壓縮/ 批量壓縮/ 編程方式壓縮)

1、指令壓縮html

  1.安裝node,npm——詳細見nodejs安裝與使用入門node

  2.安裝 uglifyjs——npm install -g uglify-jsgit

  3.壓縮例子:1)uglifyjs  main.js->main-min.js 
        2)uglifyjs main.js -o main-min.jsgithub

 

2、批量壓縮npm

1)新建txt文件,內容以下編程

@echo off
:: 設置壓縮JS文件的根目錄,腳本會自動按樹層次查找和壓縮全部的JS
SET JSFOLDER=D:\uglifyDestination(注意路勁中不能有空格)
echo 正在查找JS文件
chdir /d %JSFOLDER%
for /r . %%a in (*.js) do (
    @echo 正在壓縮 %%~a ...
    uglifyjs %%~fa  -m -o %%~fa
)
echo 完成!
pause & exit

2)另存爲.bat文件app

3)將須要壓縮的js文件放置目錄jsp

4)運行bat文件函數

 

3、編程方式壓縮ui

說明:編寫一個build.js文件,使用node命令執行該文件。build.js中的代碼會去調用UglifyJS的接口函數以執行壓縮任務。 

 

1,去github下載最新的UglifyJS。兩種方式下載,若是安裝了git,進入git控制檯使用以下命令

git clone git://github.com/mishoo/UglifyJS.git

或者使用http方式下載,點擊zip下載。解壓後其目錄結構以下

 

2,新建一個項目(文件夾)myApp,將uglify-js.js和lib目錄拷貝到本身的項目中。以下

 

3,在myApp中新建一個compress.js,內容以下

var fs  = require('fs');
var jsp = require("./uglify-js").parser;
var pro = require("./uglify-js").uglify;
 
var origCode = "var abc = function(){ var one = 5; return one;}";
var ast = jsp.parse(origCode); // parse code and get the initial AST
ast = pro.ast_mangle(ast); // get a new AST with mangled names
ast = pro.ast_squeeze(ast); // get an AST with compression optimizations
var finalCode = pro.gen_code(ast); // compressed code here
console.log(finalCode);

說明:取fs模塊,它是node的文件模塊、UglifyJS的兩個模塊。

 

4,打開命令行,執行compress.js

控制檯輸出了壓縮後的代碼。好了,就這麼簡單。

 

5,既然在node環境下,固然能夠寫一個函數直接讀取源文件,壓縮後輸出到指定的目錄。將以上代碼封裝到一個函數中,以下

// 讀取一個文件,壓縮之
function buildOne(flieIn, fileOut) {
    var origCode = fs.readFileSync(flieIn, 'utf8');
    var ast = jsp.parse(origCode);
        ast = pro.ast_mangle(ast);
        ast = pro.ast_squeeze(ast);
         
    var finalCode = pro.gen_code(ast);
     
    fs.writeFileSync(fileOut, finalCode, 'utf8');
}

 

6.壓縮,輸出到myApp目錄中

buildOne('main.js', 'main.min.js');

 

 參考:http://home.cnblogs.com/u/snandy/

相關文章
相關標籤/搜索