以下の内容はhttps://takamints.hatenablog.jp/entry/es6-grunt-contrib-uglify-esより取得しました。


ES6に対応した「grunt-contrib-uglify-es」を使用する

grunt-contrib-uglifyのES6対応版がgrunt-contrib-uglify-esという名で別途公開されてましたというお話。

f:id:takamints:20180322202444p:plain

posted with amazlet at 18.03.22
WINGSプロジェクト (2015-08-28)
売り上げランキング: 1,828

JavaScriptのタスクランナーGruntからUglify-Jsを使用してスクリプトを圧縮・難読化する grunt-contrib-uglify なんですが、ES6に対応していなくて困ってました。 ES6の「アロー関数」や「 letによるブロックスコープの変数宣言」は、うっかりミスの防止に役立ちますから今後なるべく使いたい。 この手のバグは見つけにくいので手を焼きますから。

「しかし uglify でコケるから・・・」ってのはまさに本末転倒。ということで、本腰入れて「どうにかならんか?」と調べてみたら Stack Overflow に、

「grunt-contrib-uglify の harmony ブランチが使えるぜ!」という情報がありました。 このブランチで(その名の通り)ES6対応しているようです(完全ではないとも書いてありますが)。 で、GitHub から特定ブランチをnpmでインストールするには以下のようにすれば良いらしい。

$ npm install git://github.com/gruntjs/grunt-contrib-uglify.git#harmony --save-dev

これを実行すると grunt-contrib-uglify-es というモジュールがインストールされたので、まさかと思って npm で grunt-contrib-uglify-es を検索すると、なんとそのものズバリが公開されているじゃありませんか。てことで、GitHubから取ってこなくても、以下の普通なnpmでよかったみたい。

$ npm install grunt-contrib-uglify-es --save-dev

加えてモジュール名が変わったので、 Gruntfile.js のタスクロード部分も書き換えが必要ですね。

Gruntfile.js

    ~
    grunt.loadNpmTasks('grunt-contrib-uglify-es');
    ~

これでめでたくアロー関数とletが使えるようになりました。

元々入ってた grunt-contrib-uglify は、残しておいても問題なさそうですが、 まあ、使わないならアンインストールしておくべきでしょう。

参考サイト




以上の内容はhttps://takamints.hatenablog.jp/entry/es6-grunt-contrib-uglify-esより取得しました。
このページはhttp://font.textar.tv/のウェブフォントを使用してます

不具合報告/要望等はこちらへお願いします。
モバイルやる夫Viewer Ver0.14