Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

[android / ios] bundling failed: "TransformError #15513

Closed
esganzerla opened this issue Aug 16, 2017 · 35 comments
Closed

[android / ios] bundling failed: "TransformError #15513

esganzerla opened this issue Aug 16, 2017 · 35 comments

Comments

@esganzerla
Copy link

@esganzerla esganzerla commented Aug 16, 2017

Is this a bug report?

Yes

Have you read the Contributing Guidelines?

Yes

Environment

  1. react-native -v:
    react-native-cli: 2.0.0
    react-native: n/a - not inside a React Native project directory
    (I was inside the folder, version is: 0.47.1)
  2. node -v: v7.10.0
  3. npm -v: 4.2.0
  4. yarn --version: 0.17.10

Then, specify:

  • Target Platform: Android, iOS
  • Development Operating System: macOS Sierra 10.12.6
  • Build tools: Using Xcode 8.3.3 and Android Studio 2.3

Steps to Reproduce

  1. react-native init rn_reproduce_transform_error
  2. cd rn_reproduce_transform_error
  3. react-native run-ios or react-native run-android

Expected Behavior

Should show the default "Welcome to React Native!" screen.

Actual Behavior

bundling failed: "TransformError: /Users/eduardo/Desktop/rn_reproduce_transform_error/index.ios.js: Unexpected token ) (While processing preset: "/Users/eduardo/Desktop/rn_reproduce_transform_error/node_modules/babel-preset-react-native/index.js")"

Same error occurs when I tried to update RN version to 0.48.0-rc.1
SyntaxError: Unexpected token )

Reproducible Demo

https://github.com/esganzerla/rn_reproduce_transform_error

Notes

  • This happens both on android and iOS.
  • I saw some people having the same problem on issue #15496.
@tmartres

This comment has been minimized.

Copy link

@tmartres tmartres commented Aug 16, 2017

Had the same issue and after restarting my computer the issue went away for me. You might have to just close and restart your terminal and simulator too.

@PhillipWinder

This comment has been minimized.

Copy link

@PhillipWinder PhillipWinder commented Aug 16, 2017

+1

experiencing the same issue on run-android aswell as run-ios

@amerej

This comment has been minimized.

Copy link

@amerej amerej commented Aug 16, 2017

@tmartres Restarting don't work for me

@esganzerla

This comment has been minimized.

Copy link
Author

@esganzerla esganzerla commented Aug 16, 2017

Restarting didn't help here too.

@esganzerla

This comment has been minimized.

Copy link
Author

@esganzerla esganzerla commented Aug 16, 2017

I've just found a workaround:

yarn remove babel-preset-react-native
yarn add babel-preset-react-native@2.1.0

The hole is probably deeper, but that is works for me.

@jarecsni

This comment has been minimized.

Copy link

@jarecsni jarecsni commented Aug 16, 2017

I've tried to create a new RN app by RNCA (Expo) and then eject it. Works perfectly fine, although it runs on React Native 0.46.1, so I'm guessing this is an issue with 0.47.

@charpeni

This comment has been minimized.

Copy link
Collaborator

@charpeni charpeni commented Aug 16, 2017

Thank you for reporting and for the workaround @esganzerla.

It seems an issue with babel-preset-react-native@3.0.0 that was released earlier.

@jeanlauliac How should we fix this issue? Add a specific major version in react-native-cli? Or something has been planned?

`jest babel-jest babel-preset-react-native react-test-renderer@${reactVersion}`

cc @ericnakagawa who's on call.

@charpeni

This comment has been minimized.

Copy link
Collaborator

@charpeni charpeni commented Aug 16, 2017

@facebook-github-bot label Tooling

@sachinwak

This comment has been minimized.

Copy link

@sachinwak sachinwak commented Aug 16, 2017

uninstalling and installing babel-preset-react-native works for me thanks a lot @esganzerla

@ivanzotov

This comment has been minimized.

Copy link
Contributor

@ivanzotov ivanzotov commented Aug 16, 2017

Spent a lot of time trying to fix this issue, PR #15516 but I still don't understand why it works.

@ivanzotov

This comment has been minimized.

Copy link
Contributor

@ivanzotov ivanzotov commented Aug 16, 2017

I just moved plugins from plugins.push(... to const plugins = [...]

@ivanzotov

This comment has been minimized.

Copy link
Contributor

@ivanzotov ivanzotov commented Aug 16, 2017

@cpojer any ideas? it seems these changes break it – 4caf794

@charpeni

This comment has been minimized.

Copy link
Collaborator

@charpeni charpeni commented Aug 16, 2017

It's because trailing commas in function parameter lists are not supported.

@ivanzotov

This comment has been minimized.

Copy link
Contributor

@ivanzotov ivanzotov commented Aug 16, 2017

@charpeni exactly

@cpojer

This comment has been minimized.

Copy link
Contributor

@cpojer cpojer commented Aug 16, 2017

Needs node 8. Feel free to remove that and the @Format annotation, I guess.

ivanzotov referenced this issue Aug 16, 2017
Reviewed By: mjesun

Differential Revision: D5631078

fbshipit-source-id: a8d4955a723c1846b9406e734c3e3fa2c0df3fb7
@Ibrokola

This comment has been minimized.

Copy link

@Ibrokola Ibrokola commented Aug 17, 2017

It is a bug an the work around that worked for me was to edit dependency of babel in package.json to "babel-preset-react-native": "2.1.0". After which I deleted node_modules and re-installed the npm (npm install). Then it worked like a charm.

@Ibrokola

This comment has been minimized.

Copy link

@Ibrokola Ibrokola commented Aug 17, 2017

@iktw

This comment has been minimized.

Copy link

@iktw iktw commented Aug 17, 2017

This fixed it for me:
yarn add react@16.0.0-alpha.12 react-test-renderer@16.0.0-alpha.12

@gedeagas

This comment has been minimized.

Copy link
Contributor

@gedeagas gedeagas commented Aug 17, 2017

Thx a lot dude @esganzerla , your workaround fixed my problem

@coryarmbrecht

This comment has been minimized.

Copy link

@coryarmbrecht coryarmbrecht commented Aug 17, 2017

Since I'm not using yarn, @Ibrokola 's solution fixed it for me (Thanks!), but I'm curious about what that version jump (3 -> 2) could do.

@guoliang1206

This comment has been minimized.

Copy link

@guoliang1206 guoliang1206 commented Aug 18, 2017

for my case , it need execute npm install babel-preset-react-native@2.1.0 --save-dev , it works for me .

@ShubhamBabhulkar

This comment has been minimized.

Copy link

@ShubhamBabhulkar ShubhamBabhulkar commented Aug 18, 2017

For npm Following Command are work for me
$ npm uninstall babel-preset-react-native
$ npm install babel-preset-react-native@2.1.0

@ShubhamBabhulkar

This comment has been minimized.

Copy link

@ShubhamBabhulkar ShubhamBabhulkar commented Aug 18, 2017

If you Still Getting Problem in babel-preset-react-native then try Following Process

package.json

"dependencies": {
"react": "16.0.0-alpha.12",
"react-native": "0.47.1",
"babel-preset-react-native": "2.1.0" --------->Here
},

Delete 'Node_modules' folder from react native project manually
and run followinf Commands in react native project
$ npm install
$ npm start -- --reset-cache
$ react-native run-android

@Ibrokola

This comment has been minimized.

Copy link

@Ibrokola Ibrokola commented Aug 18, 2017

@cheng-kang

This comment has been minimized.

Copy link

@cheng-kang cheng-kang commented Aug 18, 2017

Check index.ios.js, see if there is a trailling comma. If so, delete it. It works for me.

const styles = StyleSheet.create({
  container: {
    flex: 1,
    justifyContent: 'center',
    alignItems: 'center',
    backgroundColor: '#F5FCFF',
  },
  welcome: {
    fontSize: 20,
    textAlign: 'center',
    margin: 10,
  },
  instructions: {
    textAlign: 'center',
    color: '#333333',
    marginBottom: 5,
  },
  // ↑ here, delete it
});
@cyorobert

This comment has been minimized.

Copy link

@cyorobert cyorobert commented Aug 19, 2017

@Ibrokola's solution fixed this issue for me. Thanks!

@zhiyingzzhou

This comment has been minimized.

Copy link

@zhiyingzzhou zhiyingzzhou commented Aug 20, 2017

@ShubhamBabhulkar it works for me,thank you!

@golestanirad

This comment has been minimized.

Copy link

@golestanirad golestanirad commented Aug 20, 2017

@Ibrokola thanks worked for me.

  1. delete node_modules folder
  2. go to package.json and change babel-preset-react-native: 3.0.0" to babel-preset-react-native: 2.1.0"
  3. run "npm install"
@zuhrisaifudin

This comment has been minimized.

Copy link

@zuhrisaifudin zuhrisaifudin commented Aug 20, 2017

this works ..thanks guys

@SambitPrakash

This comment has been minimized.

Copy link

@SambitPrakash SambitPrakash commented Aug 21, 2017

@esganzerla thank you a lot. I uninstall yarn and reinstall it. It worked for me.

@GuiMend

This comment has been minimized.

Copy link

@GuiMend GuiMend commented Aug 21, 2017

thanks a lot @esganzerla, i installed yarn and then added that babel-preset... and it worked for me!

@jmgallo55

This comment has been minimized.

Copy link

@jmgallo55 jmgallo55 commented Aug 22, 2017

Hey Guys-
Nothing new, just writing what worked for me:

  1. npm install --save-dev babel-preset-react-native@2.1.0
  2. npm install
  3. react-native run-android
@varunagg45

This comment has been minimized.

Copy link

@varunagg45 varunagg45 commented Sep 1, 2017

@cheng-kang your answer worked. I did all the steps necessary, yarn delete yarn add, npm install, uninstall, babel preset version upgrades but nothing worked but your solution.

@nikkwong

This comment has been minimized.

Copy link

@nikkwong nikkwong commented Jun 4, 2018

I'm running into this in babel-preset-react-native: ^5.0.0. Anyone else having this problem? I've tried several different versions of babel-preset-react-native and haven't had any luck. Been debugging it for 7-8 hours now. Clearing xcode caches, npm caches, deleting and reinstalling pods, node modules, restarting process on :8081, where else could this be coming from? ...

error: bundling failed: SyntaxError: /nikkwong/index.js: Unexpected token < (19:12)
  17 |     render() {
  18 |         return (
> 19 |             <View>Hi</View>
     |             ^
  20 |         )
  21 |     }
  22 | }
@sujitpk-perennial

This comment has been minimized.

Copy link

@sujitpk-perennial sujitpk-perennial commented Jul 11, 2018

@nikkwong are you able to solve this issue?

@facebook facebook locked as resolved and limited conversation to collaborators Aug 16, 2018
Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
Projects
None yet
You can’t perform that action at this time.