なっく日報

技術やら生活やらのメモ

browserify + babelify構成でbabel5→6にした際の変更点

2ヶ月ぶりくらいでReact.jsを触ってみたら浦島太郎状態だったのでメモ(つらい・・・)

Babel5→Babel6に

ググッて見た感じ、全てがplugin化されているので、適宜組み込む必要があるよう。

↓のようなpackage.json

{
  "browserify": {
    "extension": [
      "jsx",
      "es6"
    ],
    "transform": [
      [
        "babelify",
        {
          "optional": [
            "utility.inlineEnvironmentVariables"
          ]
        }
      ]
    ]
}

npm install -D babel-preset-react babel-preset-stage-2 babel-preset-es2015 babel-plugin-transform-inline-environment-variables

からの

{
  "browserify": {
    "extension": [
      "jsx",
      "es6"
    ],
    "transform": [
      [
        "babelify",
         {
          "presets": [
            "es2015",
            "stage-2",
            "react"
          ],
          "plugins": [
            "babel-plugin-transform-inline-environment-variables"
          ]
        }
      ]
    ]
}

こうじゃ。

※なお、pluginをまとめたものをpresetと呼ぶもよう。