PHPでphp-uglifyjsを使用してjavascriptファイルをcompress＆mangleする【Node.js】【uglifyjs】

hoge

最初にNode.jsをインストール

お目当てのphp-uglifyjsを動かすにはuglifyjsを使用するので、入ってなければnodejsを入れる

yum install nodejs
yum install npm
npm install n -g

動作確認

node --version
npm --version

今回はnode : v6.17.1、npm : 3.10.10がインストールされた

次にUglifyJSをインストール

本家サイト：mishoo/UglifyJS

root権限で実行

npm install uglify-js -g

動作確認

which uglifyjs
uglifyjs -v

今回はv3.14.2がインストールされた
これでuglifyjsコマンドが使えるようになった

最後にphp-uglifyjsをインストール

本家サイト：chewett/php-uglifyjs

どっかライブラリ等を置いておくようなディレクトリを作成してそこで実行

composer require chewett/php-uglifyjs
composer update

今回はv2.1.1がインストールされた

これでインストールは終了

PHP内での使い方

参考サイト：UglifyJSをphpで使用する２。

php-uglifyjsをインストール場所にautoload.phpが入っているので、そこへのpathを通す

require_once '/pathTo/autoload.php';
use Chewett\UglifyJS\JSUglify;
use Chewett\UglifyJS\UglifyJSException;
$ug = new JSUglify();
$inputJS = ["/pathTo/input1.js","/pathTo/input2.js","/pathTo/input3.js"];//複数指定可
$outputJS = "/pathTo/output.min.js";
$options = ['compress' => '','mangle' => '','comments' => ''];//mangleしてminifyして著作権コメントは残す
$ug->uglify($inputJS, $outputJS, $options);//実行

option設定はUglifyJS本家サイトに詳細が載っている
ただし、php-uglifyjs側で対応していないと思われるものも多いが、必要最低限は使用できる。

compress：ソースから改行・不要スペースを取り除きminifyする
mangle：ソース内の名前を最短化する
beautify：ソースの体裁を整えて読みやすくする
comments：著作権コメントを保持する

結果はこんな感じ

!function(){
  "use strict";
  function fff(ccc){
    return ccc * 2;
  }
  let aaa = '123';
  let bbb;
  bbb = fff(aaa);
  alert(bbb);
}();

↓

!function(){"use strict";alert(246)}();

関数内の変数のみをmangleするようなので、メインを即時関数で囲っている。
変数の計算後を展開しちゃっててなんかすごい

ちなみに即時関数で囲む方法の記事はこちら → javascriptで全体を即時関数で囲む書き方

ちなみに関数で囲わなかった場合は↓

function fff(ccc){
  return ccc * 2;
}
let aaa = '123';
let bbb;
bbb = fff(aaa);
alert(bbb);

↓

function fff(b){return 2*b}let aaa="123",bbb;bbb=fff(aaa),alert(bbb);

このようにfff関数内だけ、変数名がmangleされる

グローバル変数の衝突回避のためにも、即時関数で囲むことをおススメします