LoginSignup
1
3

More than 5 years have passed since last update.

babel-preset-es2015をbabel-preset-es2015-node6に変えてビルドを早くする

Posted at

Node.js 4.x系で作ってたWEBアプリケーションがあり、サーバーサイドでもbabelにbabel-preset-es2015を噛ませて通してた。
これを 6系 にアップグレードしようと思ったんだけど、そういえば6系にしたらimport/export以外はほとんどES2015サポートしてるはずと気づいた。
そうなってくるとbabelで無駄なトランスパイルがいっぱい走って時間の無駄なのでどうにかできないかなとおもってぐぐったらピッタリなライブラリがあった。
https://github.com/jhen0409/babel-preset-es2015-node6

普通に考えてこっちのほうが無駄が少ないので変更してみる。

babel-preset-es2015 -> babel-preset-es2015-node6

まずはnodeのアップデート。2016/11/22現在のレコメンドバージョンということでv6.9.1を使うことにした。

console
$ nvm install v6.9.1
$ nvm alias default 6.9.1

次にpresetsをes2015-node6に置き換え。

console
$ npm install --save-dev babel-preset-es2015-node6

es2015-node6を入れて

.babelrc
   "presets": [
-    "es2015"
+    "es2015-node6"
   ]

babelの設定を書き換える。
以上。アプリケーションもうまく動いたので互換性は保てそう。

ビルド時間計測

早くなるのは当たり前で、どれくらいはやくなったか試してみる。

babel-preset-es2015

console
$ npm run build:server
[12:01:16] Starting 'build:server'...
[12:01:19] Finished 'build:server' after 2.9 s

babel-preset-es2015-node6

console
$ npm run build:server
[12:03:36] Starting 'build:server'...
[12:03:38] Finished 'build:server' after 1.94 s

1秒短縮!トランスパイルしたあとのファイルも軽くなってオトク。

「サーバーサイドでわざわざbabel通すな」とか「まだimport使うな」のような天の声が聞こえてきそうですが、もし同じようなことをしている人は試してみるとストレス軽減できるかも。

1
3
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
1
3