【webpack】(2018年1月現時点で)ES2015 (ES6)のままminifyする方法

---

※この記事は2018年1月に書いた記事です。

【webpack】(2018年2月25日現時点で)ES2015 (ES6)のままminifyする方法を新しく書いたのでこちらを参照したほうが幸せになれると思います。
こちらの結論は、webpackv4.0.0使えということになります。

残念ながらwebpackv4.0.0には出来ないという方はこの記事を読み進めてください。

---

去年も【webpack】(現時点で)ES2015 (ES6)のままminifyする方法という記事を書きましたが、
最近はまた違う方法で出来るので記事を書きます。
（前回よりは公式っぽいツールを使います。）

初めにwebpack標準のminifyツール

前回記事にもう少し詳細を書きましたが、
webpackでminifyする場合、通常はwebpackの中のwebpack.optimize.UglifyJsPluginを利用しますね。
ただしこの場合ES5でjavascriptを記述するか、ES5へのトランスパイルが必須になります。

（現在webpackはv3.10.0）

uglifyjs-webpack-plugin

uglifyjs-webpack-pluginはwebpackのwebpack.optimize.UglifyJsPluginの実態です。

リンク先のドキュメント見ると、ES6に対応している風です。
早速試してみました。

uglifyjs-webpack-pluginのインストール

webpack v3.10.0の依存関係にあるuglifyjs-webpack-pluginはv0.4.6と古い様子なので、個別にインストールします。

npm i -D uglifyjs-webpack-plugin

私がインストールしたときのバージョンはv1.1.6でした。

webpack.optimize.UglifyJsPluginにES6のOptionをつけてみる（失敗）

https://www.npmjs.com/package/uglifyjs-webpack-plugin#uglifyoptions
にあるようにuglifyOptions: {ecma: 6}とOptionをつけてみます。

webpack.config.js

module.exports = {
  // ・・・
  plugins: [
    new webpack.optimize.UglifyJsPlugin({uglifyOptions: {ecma: 6}}),
  ],
  // ・・・
}

としてみました。ただしこれだと失敗します。
webpack v3.10.0の依存関係にあるuglifyjs-webpack-pluginはv0.4.6と古いので
このコードではv0.4.6のuglifyjs-webpack-pluginが呼ばれていました。

uglifyjs-webpack-pluginにES6のOptionをつけてみる（成功）

以下のように変更します。

webpack.config.js

const UglifyJsPlugin = require('uglifyjs-webpack-plugin');
module.exports = {
  // ・・・
  plugins: [
    new UglifyJsPlugin({uglifyOptions: {ecma: 6}}),
  ],
  // ・・・
}

めでたく、ES2015 (ES6)のままminifyできましたー

---

webpackの公式対応はいつなんでしょう？
webpackv4.0.0で標準対応されました！！