nodejsでES6を使うときのbabelメモ

nodejsでES6を利用する場合にBabelでのトランスパイラが必要になってくるので最低限の環境整備の仕方。

#必要なもの

• モジュール
  • babel-cli
  • date-utils
• ファイル
  • sample_es6.js ※ES6で書かれたjs
  • .babelrc

#概要
nodejsでes6(import/export)をそのまま使おうとしてターミナルから node sample_es6.js を実行すると Uncaught SyntaxError: Unexpected token import となって実行できないのでそれの解決メモ。

#検証
検証用にES6で書かれたjsファイルを作成。

sample_es6.js

import 'date-utils';

const now = new Date();
console.log(now.toFormat('YYYY年MM月DD日 HH24時MI分SS秒'));

これを何も用意せずにnodeコマンドで実行すると

$ node sample_es6.js
...\sample_es6.js:1
(function (exports, require, module, __filename, __dirname) { import 'date-utils';
                                                              ^^^^^^

SyntaxError: Unexpected token import
    at createScript (vm.js:80:10)
    at Object.runInThisContext (vm.js:139:10)
    at Module._compile (module.js:616:28)
    at Object.Module._extensions..js (module.js:663:10)
    at Module.load (module.js:565:32)
    at tryModuleLoad (module.js:505:12)
    at Function.Module._load (module.js:497:3)
    at Function.Module.runMain (module.js:693:10)
    at startup (bootstrap_node.js:188:16)
    at bootstrap_node.js:609:3

というようにSyntaxErrorが発生します。これを解決します。

#解決手順
これを解決するにはBabelというES6をNodeが理解してくれうようにES5に変換するツールをインストールします。

まずは必要なモジュールをインストールする。

$ npm install babel-cli

親のディレクトリに.babelrcを作成して、中身に↓を書く。

.babelrc

{
    "presets": [
        [
            "env", {
                "targets": {
                    "node": "current"
                }
            }
        ]
    ]
}

※"node":"current" はnode側で自動的に利用するものは判別してくれるらしい？

あとはES6で書かれたファイルを以下のコマンドで実行するのだが、その前にbabel-cliをグローバルインストールする必要がある。

ということで実行

$ babel-node sample_es6.js
2018年04月06日 00時15分53秒

無事にSyntaxErrorも出ずに実行できました。