react-packager Unexpected token (flow related)

Question

This happens from me from time to time. After a cache clean up "suddenly" react-native stops working without a seemingly clear reason.

/Users/Shared/projects/project/node_modules/react-native/packager/react-packager/src/Logger/index.js:85
printFields? = [])
           ^
SyntaxError: Unexpected token ?
    at Object.exports.runInThisContext (vm.js:76:16)
    at Module._compile (module.js:542:28)
    at loader (/Users/Shared/projects/project/node_modules/babel-register/lib/node.js:144:5)
    at Object.require.extensions.(anonymous function) [as .js] (/Users/Shared/projects/project/node_modules/babel-register/lib/node.js:154:7)
    at Module.load (module.js:487:32)
    at tryModuleLoad (module.js:446:12)
    at Function.Module._load (module.js:438:3)
    at Module.require (module.js:497:17)
    at require (internal/module.js:20:19)
    at Object.<anonymous> (/Users/Shared/projects/project/node_modules/react-native/packager/react-packager/index.js:14:16)

I'm on react-native 0.38.0, node 6.1.0, but also tried switching to node 6.9.2 Tried removing and reinstalling (through yarn) the node_modules folder. I'm fairly certain that the specific error is irrelevant. What seems to be happening is that flow syntax is not being recognized.

.babelrc

{
  "presets": [
    "react-native",
    "react-native-stage-0",
    "react-native-stage-0/decorator-support",
  ]

}

dev dependencies

"babel-cli": "^6.18.0",
"babel-core": "^6.21.0",
"babel-eslint": "^7.1.1",
"babel-plugin-transform-decorators-legacy": "^1.3.4",
"babel-plugin-transform-es2015-modules-commonjs": "^6.7.4",
"babel-plugin-transform-flow-strip-types": "^6.21.0",
"babel-preset-airbnb": "^2.0.0",
"babel-preset-es2015": "^6.9.0",
"babel-preset-react": "^6.11.1",
"babel-preset-react-native": "1.9.1",
"babel-preset-react-native-stage-0": "^1.0.1",
"babel-register": "^6.9.0",
"chai": "^3.5.0",
"chai-as-promised": "^6.0.0",
"chai-enzyme": "^0.6.1",
"chai-immutable": "^1.6.0",
"commitizen": "^2.9.2",
"cz-conventional-changelog": "^1.1.6",
"enzyme": "^2.2.0",
"eslint-config-airbnb": "^13.0.0",
"eslint-plugin-react": "^6.8.0",
"expect.js": "^0.3.1",
"flow": "^0.2.3",
"flow-bin": "^0.37.3",
"immutablediff": "^0.4.3",
"mocha": "^3.0.2",
"react-dom": "^15.3.1",
"react-native-mock": "^0.2.6",
"reactotron-redux": "^1.6.1",
"redux-debounce": "^1.0.1",
"redux-debounced": "^0.3.0",
"redux-devtools": "^3.1.1",
"redux-devtools-dock-monitor": "^1.1.0",
"redux-devtools-log-monitor": "^1.0.5",
"redux-mock-store": "^1.0.2",
"remote-redux-devtools": "^0.5.7",
"sinon": "^1.17.5",
"why-did-you-update": "0.0.8"

Any suggestions?

Answer 1

The simplest answer I have here is: downgrade to Node 5.x.

The longer answer is that it's probably due to a bug in transform-flow-strip-types (not stripping the ?), but is circumvented via the Babel preset es2015-node containing transform-es2015-parameters. BUT, es2015-node only includes the plugins when running in Node <= 5.x.

I've created an issue over at the React Native issues page if you want to follow along: https://github.com/facebook/react-native/issues/11601