Upgrade to Babel v6

[erikras]

Anyone want to give this a shot? Quite a few things have changed. I don't really understand how the react-transform stuff is set up in the .babelrc. I got most of the way there, but had to turn back.

Kudos for anyone who can figure this out.

[erikras]

Word of advice, apparently you have to put some plugins inside your presets array, like so:

{
  "presets": [
    {
      "plugins": [
        "syntax-class-properties",
        "transform-class-properties"
      ]
    },
    "es2015",
    "react",
    "stage-0"
  ]
}

[monojones]

From discussion of this Babel 6 official post
plugins array is not inside the presets:

    {
       "presets": [ 
            "react", 
            "es2015" 
        ],
       "plugins": [ 
            "transform-es2015-modules-commonjs", 
            "transform-react-constant-elements" 
        ]
     }

Hope that helps

[justingreenberg]

@erikras we'll have to wait for some dependency updates to support babel 6 (react-transform, typecheck and eslint)... in the meantime, our new .babelrc will look something like this:

{
  "presets": ["es2015", "react", "stage-0"],
  "plugins": [
    "typecheck"
  ],
  "env": {
    "development": {
      "plugins": [
        ["react-transform", {
          "transforms": [{
            "transform": "react-transform-hmr",
            "imports": ["react"],
            "locals": ["module"]
          }, {
            "transform": "react-transform-catch-errors",
            "imports": ["react", "redbox-react"]
          }]
        }]
      ]
    }
  }
}

a couple of notes :

• presets can be passed as query to babel-loader (webpack dev config)
• optional and stage objects have been removed from babel-loader query
• babel-core/polyfill is now babel-polyfill

i'm happy to take care of this once deps are supported

[erikras]

Awesome work, @justingreenberg!! 👍

If anyone comes across this issue after the next react-transform release, leave a note to remind us.

[erikras]

Babel Doctor was just released. Might be helpful to this issue.

[austinmao]

I did this yesterday on another project of mine. It took a couple hours.

Babel no longer takes options. You need to specify everything in .babelrc:
https://github.com/austinmao/sails-mongoose-boilerplate/blob/front-end/.babelrc

You have to require polyfill if you are using regenerator (async/await)
https://github.com/austinmao/sails-mongoose-boilerplate/blob/front-end/test/bootstrap.test.js

babel has been replaced with babel-core

[quicksnap]

When we do upgrade to Babel 6, let's try and lump it into one nice commit so everyone can migrate easily!

[justingreenberg]

Babel 6 Migration (Updated 12/09/15):

• babel-plugin-transform-decorators - decorators are not supported in babel 6... if this becomes a bottleneck we can switch to function composition until the specification/proposal is stable
  • Edit 12/09/15: Implement new decorator proposal when finalized
• babel-plugin-react-transform - supported 12/08/15
• babel-eslint - supported 11/28/15
• babel-plugin-typecheck - supported 11/17/15

so yeah, bleeding edge is all fun and games until your toolkit completely changes

[erikras]

"Bleeding edge is all fun and games". LOL. 🔪 🏥 💉

[snackycracky]

to be honest I would mark this repository as stable before going to babel 6.
Afterwards we can mark it as stable again if all those issues are resolved.

[quicksnap]

I was thinking the same thing. However, with thoughts to "stable", React itself is still not 1.0, but Redux and React-Router are. Should we continue as pre-1.0 or not?

[quicksnap]

@erikras ^

[erikras]

You could probably edit the comment and still manage to tag me. In fact, I'm gonna try that with this comment. [Edit: @quicksnap] 😃

It's a shame that even Facebook fails to follow SemVer.

I'm confused as to what this "stable" labeling actually means. Do you just mean declaring 1.0?