LoginSignup
4
6

More than 5 years have passed since last update.

お試しでES2015を書く時は、CLIでBabelを動かすと便利

Last updated at Posted at 2016-04-03

初心者ネタです。すみません。

さくっとES2015を書いて、手元で確認したいときってありますよね。

公式のTry it outをいちいち開くのめんどくさくないですか?ローカルでお手軽にトランスパイルしたくないですか?
そんな人のためのメモです。

babel-cli

CLIでBabelを動かすには、babel-cliというパッケージが必要です。

$ npm install babel-cli --save-dev

参考:https://babeljs.io/docs/usage/cli/

preset

さらに、es2015をトランスパイルするにはプリセットが必要です。ここでは、babel-preset-es2015をインストールします。(パッケージ名が長い。)

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

参考:http://babeljs.io/docs/plugins/preset-es2015/

babelrc

.babelrcというファイルを作成します。

// .babelrc
{
  "presets": ["es2015"]
}

トランスパイル

トランスパイルします。

$ babel main.js --out-file index.js

main.js : ES2015を書いたファイル。
index.js: トランスパイル後のファイル。

実行

ターミナル上で実行します。

$ node index.js

以上です。もっと良い方法があればぜひ教えて下さいませ。

4
6
1

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
4
6