React-native: Error : React native 23.1 with babel async await

Created on 10 Apr 2016  路  13Comments  路  Source: facebook/react-native

Have asked in StackOverflow, no joy :-1:

Getting following error

uncaught error Error: SyntaxError: /Users/senthilsivanath/Documents/MusicTulip/index.ios.js: Unexpected token (50:23)
48 | renderScene: function(route,nav) {
49 | try{
50 | const response = await fetch('http://www.google.com')
Have added babel es 2015 & stage 3 preset

.babelrc file is

{ "presets": ["react-native", "es2015", "babel-preset-stage-3"] }
Packages.json

{ "name": "ProjectName", "version": "0.0.1", "private": true, "scripts": { "start": "react-native start" }, "dependencies": { "apsl-react-native-button": "^2.4.2", "babel-plugin-transform-async-to-generator": "^6.7.4", "babel-preset-react": "^6.5.0", "react-native": "^0.22.2", "react-native-button": "^1.4.2", "react-native-fabric-digits": "github:proximaio/react-native-fabric-digits", "react-native-facebook-login": "^1.0.0", "react-native-progress": "^2.2.2", "react-native-router-flux": "^3.1.5", "react-native-swiper": "^1.4.3", "react-native-vector-icons": "^1.3.2", "realm": "^0.10.0" }, "devDependencies": { "babel-cli": "^6.7.5", "babel-preset-react-native": "^1.5.6", "babel-preset-stage-3": "^6.5.0" } }

Ran Commands Locked

Most helpful comment

@satya164

Thanks, had to remove Es2015 from .babelrc. I don't know why this conflict. But it works.

All 13 comments

Try add async keyword to line 48:

48 | renderScene: async function(route,nav)

No need to change .babelrc.

@cpunion is saying to try this:

renderScene: async function(route, nav) {
   try {
         const response = await fetch('http://www.google.com');
    ...

Notice the addition of the async keyword before function

@radiovisual
Thanks, let me verify.

BTW hit with https://github.com/facebook/react-native/issues/4968 bug, god save RN 4968

Got the same error

index.ios.js: Unexpected token (16:22)

renderContent:async function(){
const response = await fetch('http://www.google.com')
},

@senthilsivanath can you post your code file with the full error?

node-haste] Encountered an error while persisting cache:

SyntaxError:/xxxxxx/index.ios.js: Unexpected token (16:22)
14 | class MusicTulip extends Component {
15 |

16 | renderContent: async function(){
| ^
17 | const response = await fetch('http://www.google.com')
18 | },

I have tried reset of packagerCache too, no help.

@senthilsivanath Your syntax for class methods seems to be wrong.

class MusicTulip extends Component {
    async renderContent() {
        const response = await fetch('http://www.google.com')
    }
 }

Notice the lack of :, function keyword and comma at the end.

@facebook-github-bot answered

Closing this issue as @satya164 says the question asked has been answered. Please help us by asking questions on StackOverflow. StackOverflow is amazing for Q&A: it has a reputation system, voting, the ability to mark a question as answered. Because of the reputation system it is likely the community will see and answer your question there. This also helps us use the GitHub bug tracker for bugs only.

Hey @satya164

Thanks for that, the error moved to babelHelpers type of is not a function

babelHelpers.typeof(value) is undefined

26 [fatal][tid:com.facebook.React.RCTExceptionsManagerQueue] Unhandled JS Exception: Module

@senthilsivanath Can you post the full stacktrace along with the source code?

babelrc

{ "presets": ["es2015", "react-native"]}

App code

class MusicTulip extends Component {

async renderContent(){
const response = await fetch('http://www.google.com')
}
render() {
return (
Welcome to React Native!

To get started, edit index.ios.js

Press Cmd+R to reload,{'n'}
Cmd+D or shake for dev menu


);
}
}

Xcode throws
2016-04-11 20:06:50.070 [fatal][tid:com.facebook.React.RCTExceptionsManagerQueue] Unhandled JS Exception: Module RCTLog is not a registered callable module.
2016-04-11 20:06:50.070 [error][tid:com.facebook.React.JavaScript] Module RCTLog is not a registered callable module.
2016-04-11 20:06:50.070 [fatal][tid:com.facebook.React.RCTExceptionsManagerQueue] Unhandled JS Exception: Module RCTLog is not a registered callable module.
2016-04-11 20:06:50.071 [error][tid:com.facebook.React.JavaScript] Module RCTLog is not a registered callable module.

image

@satya164

Thanks, had to remove Es2015 from .babelrc. I don't know why this conflict. But it works.

Was this page helpful?
0 / 5 - 0 ratings