React Native TransformError

[vincentma]

Steps to reproduce,

1. Create a React Native project.

react-native init test_diff
cd test_diff
npm install --save diff

2. Modify index.ios.js file, and add the following line.

import {diffChars} from "diff";

3. Now run the React Native packager.

react-native run-ios

4. Error shows up. See attached.

[vincentma]

I fixed this problem by add the babel presets into my project.

yarn add babel-preset-es3
yarn add babel-preset-es2015-mod

Also add the ignore file list into .babelrc. So the .babelrc looks like

{
  "presets": ["react-native"],
  "ignore": [
    "node_modules/diff/lib/**/*.js",
    "node_modules/diff/node_modules/**/*.js"
  ]
}

And make sure clear RN cache.

watchman watch-del-all
./node_modules/react-native/packager/packager.sh start --reset-cache
react-native run-ios

[piaaaac]

Had the same error using react (for web, not native), and your solution worked for me as well:

npm i --save-dev babel-preset-es3
npm i --save-dev babel-preset-es2015-mod

and in webpack.config.js added:

  module: {
    rules: [{
      query: {
        presets: [
          'es2015', 'react',
          'es3', 'es2015-mod' // <- added these
        ]
      }
    }]
  }

[motiz88]

I believe this issue should be reopened; the fix here would be to move the config to a .babelrc file and exclude it from npm publishing.

[akehir]

Hi @kpdecker,

Since babel-preset-es2015 has been deprecated, and it's recommended to use babel-preset-env, it would be great, if it wasn't required to install babel-preset-es3 / babel-preset-es2015-mod for jsdiff to run without exceptions. I understand this has been fixed with a47aca9, are you planning to release a new version of jsdiff to npm which would fix this?

[cdutson]

Agreed with @akehir. Doubly so since having babel-preset-env and babel-preset-es2015 seems to cause some weird stuff to happen

[kpdecker]

Released in 3.5.0