Cannot run examples on master: warning is not a function

[felixakiragreen]

react-native: master
OS X: 10.11 Beta (15A244d)
Xcode: 7.0 beta (7A121I)

(Yes, I know I'm running a lot of beta software, but it works on rn@0.8.0)

Build succeeds, but then I get this error:

warning is not a function. (In \'warning(\n!customBubblingEventTypes[directTypeName], \n\'Event cannot be both direct and bubbling: %s\', \ndirectTypeName)\', \'warning\' is an instance of Object)'

This is my console in Xcode:

2015-08-05 12:02:28.625 [error][tid:com.facebook.React.JavaScript] 'Error: warning is not a function. (In \'warning(\n!customBubblingEventTypes[directTypeName], \n\'Event cannot be both direct and bubbling: %s\', \ndirectTypeName)\', \'warning\' is an instance of Object)\n stack: \n  <unknown>  UIExplorerApp.ios…:34577\n  require    UIExplorerApp.ios…:254\n  <unknown>  UIExplorerApp.ios…:24647\n  require    UIExplorerApp.ios…:254\n  <unknown>  UIExplorerApp.ios…:1643\n  require    UIExplorerApp.ios…:254\n  <unknown>  UIExplorerApp.ios…:1621\n  require    UIExplorerApp.ios…:254\n  <unknown>  UIExplorerApp.ios…:1529\n  require    UIExplorerApp.ios…:254\n  <unknown>  UIExplorerApp.ios…:1450\n  require    UIExplorerApp.ios…:254\n  require    UIExplorerApp.ios…:200\n  <unknown>  UIExplorerApp.ios…:80247\n URL: http://localhost:8081/Examples/UIExplorer/UIExplorerApp.ios.includeRequire.runModule.bundle?dev=true\n line: 34577\n message: warning is not a function. (In \'warning(\n!customBubblingEventTypes[directTypeName], \n\'Event cannot be both direct and bubbling: %s\', \ndirectTypeName)\', \'warning\' is an instance of Object)'
2015-08-05 12:02:28.628 [error][tid:com.facebook.React.JavaScript] 'Error: Invariant Violation: ReactUpdates: must inject a reconcile transaction class and batching strategy\n stack: \n  ensureInjected  UIExplorerApp.ios…:25825\n  batchedUpdates  UIExplorerApp.ios…:25902\n  <unknown>       UIExplorerApp.ios…:25051\n  guard           UIExplorerApp.ios…:25008\n  processBatch    UIExplorerApp.ios…:25050\n URL: http://localhost:8081/Examples/UIExplorer/UIExplorerApp.ios.includeRequire.runModule.bundle?dev=true\n line: 2071\n message: Invariant Violation: ReactUpdates: must inject a reconcile transaction class and batching strategy'
2015-08-05 12:02:38.545 [error][tid:com.facebook.React.JavaScript] 'Error: warning is not a function. (In \'warning(\n!customBubblingEventTypes[directTypeName], \n\'Event cannot be both direct and bubbling: %s\', \ndirectTypeName)\', \'warning\' is an instance of Object)\n stack: \n  <unknown>  UIExplorerApp.ios…:34577\n  require    UIExplorerApp.ios…:254\n  <unknown>  UIExplorerApp.ios…:24647\n  require    UIExplorerApp.ios…:254\n  <unknown>  UIExplorerApp.ios…:1643\n  require    UIExplorerApp.ios…:254\n  <unknown>  UIExplorerApp.ios…:1621\n  require    UIExplorerApp.ios…:254\n  <unknown>  UIExplorerApp.ios…:1529\n  require    UIExplorerApp.ios…:254\n  <unknown>  UIExplorerApp.ios…:1450\n  require    UIExplorerApp.ios…:254\n  require    UIExplorerApp.ios…:200\n  <unknown>  UIExplorerApp.ios…:80247\n URL: http://localhost:8081/Examples/UIExplorer/UIExplorerApp.ios.includeRequire.runModule.bundle?dev=true\n line: 34577\n message: warning is not a function. (In \'warning(\n!customBubblingEventTypes[directTypeName], \n\'Event cannot be both direct and bubbling: %s\', \ndirectTypeName)\', \'warning\' is an instance of Object)'
2015-08-05 12:02:38.548 [error][tid:com.facebook.React.JavaScript] 'Error: Invariant Violation: ReactUpdates: must inject a reconcile transaction class and batching strategy\n stack: \n  ensureInjected  UIExplorerApp.ios…:25825\n  batchedUpdates  UIExplorerApp.ios…:25902\n  <unknown>       UIExplorerApp.ios…:25051\n  guard           UIExplorerApp.ios…:25008\n  processBatch    UIExplorerApp.ios…:25050\n URL: http://localhost:8081/Examples/UIExplorer/UIExplorerApp.ios.includeRequire.runModule.bundle?dev=true\n line: 2071\n message: Invariant Violation: ReactUpdates: must inject a reconcile transaction class and batching strategy'
2015-08-05 12:02:38.604 [error][tid:com.facebook.React.JavaScript] 'Error: Invariant Violation: ReactUpdates: must inject a reconcile transaction class and batching strategy\n stack: \n  ensureInjected  UIExplorerApp.ios…:25825\n  batchedUpdates  UIExplorerApp.ios…:25902\n  <unknown>       UIExplorerApp.ios…:25051\n  guard           UIExplorerApp.ios…:25008\n  processBatch    UIExplorerApp.ios…:25050\n URL: http://localhost:8081/Examples/UIExplorer/UIExplorerApp.ios.includeRequire.runModule.bundle?dev=true\n line: 2071\n message: Invariant Violation: ReactUpdates: must inject a reconcile transaction class and batching strategy'
2015-08-05 12:02:38.698 [error][tid:com.facebook.React.JavaScript] 'Error: Invariant Violation: ReactUpdates: must inject a reconcile transaction class and batching strategy\n stack: \n  ensureInjected  UIExplorerApp.ios…:25825\n  batchedUpdates  UIExplorerApp.ios…:25902\n  <unknown>       UIExplorerApp.ios…:25051\n  guard           UIExplorerApp.ios…:25008\n  processBatch    UIExplorerApp.ios…:25050\n URL: http://localhost:8081/Examples/UIExplorer/UIExplorerApp.ios.includeRequire.runModule.bundle?dev=true\n line: 2071\n message: Invariant Violation: ReactUpdates: must inject a reconcile transaction class and batching strategy'

[felixakiragreen]

Related to this #2058 bug? But @brentvatne's solution did not work for me.

[felixakiragreen]

I've tracked it down to: https://github.com/facebook/react-native/blob/master/Libraries/ReactIOS/IOSNativeBridgeEventPlugin.js#L19 require('warning') but there isn't a warning module anywhere.

Also, seems related to this #2062 PR by @brentvatne.

[felixakiragreen]

Talked to brentvatne and he said:

dubert [1:03 PM]: I did a search for @providesModule warning and there aren’t any. Where is it supposed to be gotten from?

brentvatne [1:08 PM]: react-tools
brentvatne [1:08 PM]: in node_modules

dubert [1:12 PM]: Ah, found it. It’s weird that it’s not getting it.

brentvatne [1:12 PM]: it is but it throws an exception because process.env.NODE_ENV isn’t defined
brentvatne [1:12 PM]: well, because process.env isn’t, and it tries to get NODE_ENV off of undefined

[beezenees]

Having the same issue - cannot run many react apps. xcode 6.4, osx 10.10.3 (14D136).

[sheki]

Having the same issue. No idea how to debug.

[austinkelleher]

+1 Rolling back to 0.8.0 fixed this issue for me as well.

[cgray9]

Seeing the same issue as well.

[felixakiragreen]

Wondering if this is related to: #2279? @brentvatne

[brentvatne]

@DUBERT - yeah I'm thinking that might help, can you try cherry-picking it to confirm?

[cgray9]

Still seeing this issue any update @DUBERT

[felixakiragreen]

@brentvatne I'm still seeing this issue on 0.9.0, 0.10.0-rc, with and without the NODE_ENV polyfill

[cgray9]

I got it working for me now! I thought that I was running iojs2.5 via nvm, but it look like I was still on node. When I flipped to iojs and ran npm install and recompiled it was good to go.

[felixakiragreen]

@cgray9 I'm using nvm, so that might be it. Can you explain a little more clearly what was the problem and what you did to fix it?

[cgray9]

@DUBERT - I was receiving the exact same error message that you posted originally when I upgraded from 0.8.0 to 0.9.0 or 0.10.0-rc.

I'm using the fish shell and had used bass to run nvm and install iojs2.5.0. However, I had not sourced nvm in my fish profile so when I compiled and the terminal launched it was pulling node instead of iojs. There was a message in the terminal stating that I was running node and needed to switch to iojs.

For simplicity sake I switched to bash shell for now and sourced nvm in my bash profile. Looks something like this:

export NVM_DIR="/Users/cgray9/.nvm"
[ -s "$NVM_DIR/nvm.sh" ] && . "$NVM_DIR/nvm.sh"  # This loads nvm

Let me know if I can provide any further details!

[felixakiragreen]

Aha! My nvm was not defaulting to iojs. So I had to run nvm alias default iojs-v2 and then do npm install again and now it works. Thanks a lot @cgray9 !

[tblomseth]

I have positively been running io.js all the time while trying to get React Native working but have been struggling with this issue anyway for some days—and thought I might share my findings.

I saw the issue after integrating the Om (ClojureScript interface to React https://github.com/omcljs/om) and Ambly (ClojureScript REPL into JavaScriptCore https://github.com/omcljs/ambly) libraries.

It turned out that Om has a dependency on React and comes with its own set of packaged React modules in a file called react.inc.js. If that file is placed in the folder structure in or below the React Native project you have the conundrum because the packager will pick up that very file and inject stuff from there into the package being generated. Then the index.ios.bundle or main.jsbundle might look like this around the definition of the warning module:

Notice, how the warning module clocks in at almost 15K lines of code. It seems a bit much for such relatively simple functionality. Also, the export from the warning module is no longer a function but an object which fits the error message displayed above.

Remove the react.inc.js file buried in the folder structure and a more reasonably sized warning module is put together by the packager:

I haven't looked into to exactly why the packager does what it does in this scenario and am not planning on it either. I'll just refrain from placing already packaged React stuff in the folder structure the packager is operating on.

[mfikes]

@tblomseth I encountered something (perhaps the same) when upgrading the Ambly quick start from RN 0.6 to 0.8 and restructured the tree to avoid letting the RN packager see the ClojureScript compiler output directory.

[almost]

I have the same issue (looks like the packager is picking up some other massive file instead of the "warning" module) but I don't seem to have a react.inc.js in my tree. Is there an easy way to get the packager to tell me how it resolved each module lookup so I can track down the problem?

[almost]

I went the hacky route and stuck a console.log(depGraph) in the packager :)

Found that the file it's resolving "warning" to is node_modules/react-native/node_modules/react-tools/docs/js/react.js (presumably for the same reason @tblomseth saw, because it includes the line @providesModule warning)

I'm going to delete that file now (and add a postinstall npm command to do it next time), it would be nice to be able to configure the packager to ignore files though (and also to have it be a bit more sensible about where it gets its modules from!)

[gnestor]

I solved this by simply installing warning in the the react-native directory (go to /node_modules/react-native and npm install warning. It's bizarre because warning is required 51 times in react-native and it's not in the package.json?

[JedWatson]

I'm just leaving a note here to say that I encountered this issue as well, and it was a real road-block. I updated to iojs 2.5 but that didn't help at all. Installing warning in /node_modules/react-native also didn't help.

The solution @almost mentioned - deleting the file node_modules/react-native/node_modules/react-tools/docs/js/react.js resolved it for me. There seem to be multiple issues with that file, just removing the line @providesModule warning leads to another error, I'm guessing with another module that file "provides".

[PascalGiessler]

Same issue for me. Just delete the file node_modules/react-native/node_modules/react-tools/docs/js/react.js and everything is fine. Thanks to @almost.

[kmsheng]

omg @PascalGiessler you save my night ! Thank you !

[xescugc]

Thanks @PascalGiessler and @almost 👍

[jhyman2]

I did what @almost suggested and am still having the same exact issue. Even tried npm install warning and no difference.

Edit: Fixed by upgrading to Node v4.0.0.

[hzhu]

Having this same issue. Fixed with @almost 's solution.

[jibonpabna]

😈👿👿👿

[mave99a]

Thanks @almost ! It worked.

[pbojinov]

Amazing, thank you @PascalGiessler. Was stuck on this for a while

[chai2]

thanks @PascalGiessler and @almost. Works now :)

[prakas25]

I encountered the same issue, what i discovered was in recent versions of react native(in Debug Mode) you have to keep "JS Dev Mode" on, without it you will face this issue