2017/06/23

[npm][node]babelでコンパイルするまでの道のり

reactをbabelを使ってコンパイルするにあたってそもそもbabelを使ったことがないので、その方法をついて調査しました。

まずは、Babel CLIをインストール。

npm install -g babel-cli
globalインストールはバッドノウハウなのですが、いったんはこれで。

次に、reactを使いたいので、
npm install --save-dev babel-preset-react
さらに、es2015に変換してほしいので、
npm install --save-dev babel-preset-es2015
にしてpackage.jsonを下のように設定。
{
  "description": "react test",
  "repository": {},
  "license": "MIT",
  "dependencies": {
    "babel-cli": "^6.24.1",
    "react": "^15.6.1",
    "react-dom": "^15.6.1"
  },
  "devDependencies": {
    "babel-preset-es2015": "^6.24.1",
    "babel-preset-react": "^6.24.1"
  },
  "babel": {
    "presets": [
      "react",
      "es2015"
    ]
  }
}
でターミナルで
babel script.js
を打ち込んだらでました!

上の場合は、ターミナルに表示されてしまうので、ファイルに出力させたい場合は、
babel foo.js -o hoge.js
でOK

やっとできた。

0 コメント:

コメントを投稿