Babel Plugin React Transform Versions Save

• Fixes an issue when a bad polyfill breaks Array#find (#73, 6bb8c6080114455ce4559170180a8bc0ed74d490). Thanks Lodash.

• Fixes many false positives. Now only wraps components that both have a render method and either subclass one of options.superClasses (by default Component or React.Component) or are created with one of the options.factoryMethods (by default React.createClass). (#86, #84, gaearon/react-transform-catch-errors#25, #81, #78)

• Remove Symbol usage that crept in recently. This should fix https://github.com/gaearon/react-transform-boilerplate/issues/32 on Node 0.10.

New Format

We have changed the config format a little bit.

Let's take this example from 1.0.x:

{
  "plugins": ["react-transform"],
  "extra": {
    "react-transform": [{
      "target": "xxx"
    }, {
      "target": "yyy"
    }]
  }
}

Now we're introducing a new config format:

1. The target option inside every transform configuration object was renamed to transform.
2. The array of transforms is now a property called transforms on an object.

Here's how the same config would look like after the changes:

{
  "plugins": ["react-transform"],
  "extra": {
    "react-transform": {
      "transforms": [{
        "transform": "xxx"
      }, {
        "transform": "yyy"
      }]
    }
  }
}

The locals and imports stay right where they were—it's just they're next to transform key now instead of a target key:

{
  "plugins": ["react-transform"],
  "extra": {
    "react-transform": {
      "transforms": [{
        "transform": "react-transform-hmr",
        "imports": ["react"],
        "locals": ["module"]
      }, {
        "transform": "react-transform-catch-errors",
        "imports": ["react", "redbox-react"]
      }]
    }
  }
}

That's it! The old format still works (which is why this isn't a breaking change), but prints a warning.

New Features

We didn't introduce a new format without a reason. Now there's a place for a plugin-wide configuration options, unrelated to the specific transform. The first such option, called factoryMethods, ships today, contributed by Aaron Jensen.

If you're not comfortable with ES6 classes and use a custom helper like React.createClass, previously this Babel plugin couldn't find such React components. Now, you can specify a configuration like this:

{
  "plugins": ["react-transform"],
  "extra": {
    "react-transform": {
      "transforms": [/* ... */],

      // here's the new stuff!
      "factoryMethods": ["React.createClass", "createClass", "myCustomFactoryMethod"]

    },
  }
}

This option is not required to specify and can be safely omitted, but can be useful if you prefer custom factory methods or component wrapper functions.

Enjoy!

• Remove accidental junk files in NPM release

• Allow empty transform options (#14)

• Node 0.10 compatibility (#11)

• Skip transforms for the files defining imports supplied to them

  For example,

    {
      "target": "react-transform-catch-errors",
      "imports": ["react", "./src/Error"]
    }
  

  will now skip react-transform-catch-errors for ./src/Error to avoid a circular import.

• Fix option names that were broken after renaming. Now the .babelrc option is called react-transform.

• Initial release after the rename