SyntaxError: Strict mode does not allow function declarations in a lexically nested statement

Question

After upgrading from React Native 0.18 to 0.22 for Android, I have started to get the following error:

Got JS Exception: SyntaxError: Strict mode does not allow function declarations in a lexically nested statement.

It crashes the app at start app, and it is impossible to start debugging.

As suggested by this post , I have tried to remove all 'use strict' manually as well as using build script:

gulp.task('transform-android', function() {
  return gulp.src(config.tasks.androidjs.src)
  .pipe(envify({NATIVE: true}))
  .pipe(babel({ 
    "stage": 0,
    blacklist: ["useStrict"]
  }))
  .pipe(gulp.dest(path.join(config.root.dest, config.tasks.androidjs.dest)));
});

There is no 'use strict' anymore in the generated code. However, I am still getting the exact same error. I am using babel v5.8.3.

Any help is highly appreciated!

Here's my package.json

{
  "name": "xodo",
  "version": "1.0.0",
  "main": "index.js",
  "scripts": {
    "start": "node_modules/react-native/packager/packager.sh"
  },
  "author": "",
  "license": "ISC",
  "dependencies": {
    "events": "^1.1.0",
    "firebase": "^2.3.1",
    "flux": "^2.0.1",
    "immutable": "3.7.3",
    "jwt-decode": "^1.4.0",
    "linkifyjs": "^2.0.0-beta.7",
    "lodash": "^3.10.1",
    "promise-queue": "^2.2.3",
    "react": "^0.14.7",
    "react-immutable-proptypes": "^1.5.1",
    "react-native": "^0.22.2",
    "react-native-invertible-scroll-view": "^0.2.0",
    "reqwest": "^1.1.5",
    "rsvp": "^3.0.18",
    "unbounce": "^0.1.0",
    "xmldom": "^0.1.22"
  },
  "devDependencies": {
    "babel": "^5.8.3",
    "del": "^2.2.0",
    "gulp": "^3.9.0",
    "gulp-babel": "^5.3.0",
    "gulp-envify": "^1.0.0",
    "gulp-less2js": "0.0.3",
    "gulp-rename": "^1.2.2",
    "gulp-replace": "^0.5.4",
    "gulp-sequence": "^0.4.0",
    "path": "^0.12.7"
  }
}

Below is the full stacktrace of the error:

Got JS Exception: SyntaxError: Strict mode does not allow function declarations in a lexically nested statement.
03-29 15:15:01.567 2047-2109/com.xodo.pdf.reader E/unknown:React: Exception in native call from JS
                                                                  com.facebook.react.bridge.JSExecutionException: SyntaxError: Strict mode does not allow function declarations in a lexically nested statement. (http://10.0.3.2:8081/index.android.bundle?platform=android&dev=true&hot=false:32356)
                                                                      at com.facebook.react.bridge.ReactBridge.loadScriptFromFile(Native Method)
                                                                      at com.facebook.react.bridge.JSBundleLoader$2.loadScript(JSBundleLoader.java:58)
                                                                      at com.facebook.react.bridge.CatalystInstanceImpl$2.call(CatalystInstanceImpl.java:146)
                                                                      at com.facebook.react.bridge.CatalystInstanceImpl$2.call(CatalystInstanceImpl.java:137)
                                                                      at com.facebook.react.bridge.queue.MessageQueueThreadImpl$1.run(MessageQueueThreadImpl.java:73)
                                                                      at android.os.Handler.handleCallback(Handler.java:739)
                                                                      at android.os.Handler.dispatchMessage(Handler.java:95)
                                                                      at com.facebook.react.bridge.queue.MessageQueueThreadHandler.dispatchMessage(MessageQueueThreadHandler.java:31)
                                                                      at android.os.Looper.loop(Looper.java:148)
                                                                      at com.facebook.react.bridge.queue.MessageQueueThreadImpl$3.run(MessageQueueThreadImpl.java:184)
                                                                      at java.lang.Thread.run(Thread.java:818)

Answer 1

problem appears in one of the core files. pull request is alredy created for react-native but you can make changes by yourself as workaround

open node_modules\\react-native\\Libraries\\Core\\InitializeCore.js line 112

change function handleError(e, isFatal) to var handleError = function(e, isFatal)

then do npm start -- --reset-cache

you can find more information at https://github.com/facebook/react-native/issues/11389

Answer 2

This is not a direct answer to your problem but more of a concept or reason behind the error.

When an inner function is defined in a block rather than function body it will give SyntaxError. ES5 disallows function declarations on blocks (except function bodies). On the other hand, ES2015 (ES6) has relaxed this restriction.

Here is ESLint rule no-inner-declaration