[Bridge & Packager] Module resolution issues after 0.7.0-rc.2 upgrade. #1808

dhrrgn · 2015-06-30T15:25:31Z

I wanted to test 0.7.0-rc.2, so I made the update and tried running my application. Now, everytime I stop the packager, and it restarts, I get this error:

2015-06-30 11:10:55.714 [error][tid:main][RCTModuleData.m:119] SMXTabBarManager is returning nil for it's methodQueue, which is not permitted. You must either return a pre-initialized queue, or @synthesize the methodQueue to let the bridge create a queue for you.

(I am not sure that is related to the module resolution, so, I can move that to its own issue if needed)

However, that "goes away" after a second, and it replaced by module resolution errors. I am using a few 3rd-party modules, which worked fine in 0.6.0. However, now I am getting Unable to resolve module errors. This even happens when trying to require react-timer-mixin.

Furthermore, when it actually can find and import the module, that module's code then can't resolve core RN modules. Example:

Unable to resolve module NativeModules from [project_path]/node_modules/react-native-keyboardevents/KeyboardEvents.ios.js

The text was updated successfully, but these errors were encountered:

brentvatne · 2015-06-30T16:21:57Z

@tadeuzagallo - the error re: methodQueue seems like something you would know about 😄

@amasad - NativeModules seems packager related 😸

dhrrgn · 2015-06-30T16:28:58Z

@brentvatne @amasad I just want to clarify that it is not only NativeModules, I just used that error as an example. Here is another error:

Unable to resolve module react-timer-mixin from [project_path]/App/Components/TimeAgo.js

brentvatne · 2015-06-30T16:32:12Z

@dhrrgn - try npm i react-timer-mixin --save and restart the packager, see if it fixes that issue for you. This happened I believe in 0.6.0 (don't quote me on it) and unfortunately I believe it wasn't covered in the changelog.

dhrrgn · 2015-06-30T17:00:19Z

@brentvatne Ok, so I have made some progress here. I had to re-install all of my dependencies, and things started working much better. Basically I just re-ran npm i [package] --save for all of them. I also had to install react-timer-mixin (which is not mentioned in the docs...it just says to use it).

One of my dependencies is still having an issue, but I think that is an issue with that package. Basically, that package can't find any of the RN modules (I had to fork it and remove the RN peerDependency to even get it to install with the RC anyways...here is my fork of that https://github.com/tackk/react-native-icons).

I will note: I am still getting the red screen with the methodQueue error (this does not happen with a "fresh" install, and I have tried restarting the packager, xcode, simulator, etc), but it only flashes then goes away.

dhrrgn · 2015-06-30T17:04:49Z

Another side note BTW: Even though the packager says that it can't find all of these modules, the app runs perfectly fine with no red screens (other than the methodQueue one mentioned above).

Unable to resolve module EdgeInsetsPropType from [project_path]/node_modules/react-native-icons/FAKIconImage.ios.js
Unable to resolve module NativeMethodsMixin from [project_path]/node_modules/react-native-icons/FAKIconImage.ios.js
Unable to resolve module NativeModules from [project_path]/node_modules/react-native-icons/FAKIconImage.ios.js
Unable to resolve module ReactPropTypes from [project_path]/node_modules/react-native-icons/FAKIconImage.ios.js
Unable to resolve module ImageResizeMode from [project_path]/node_modules/react-native-icons/FAKIconImage.ios.js
Unable to resolve module ImageStylePropTypes from [project_path]/node_modules/react-native-icons/FAKIconImage.ios.js
Unable to resolve module React from [project_path]/node_modules/react-native-icons/FAKIconImage.ios.js
Unable to resolve module ReactNativeViewAttributes from [project_path]/node_modules/react-native-icons/FAKIconImage.ios.js
Unable to resolve module StyleSheet from [project_path]/node_modules/react-native-icons/FAKIconImage.ios.js
Unable to resolve module StyleSheetPropType from [project_path]/node_modules/react-native-icons/FAKIconImage.ios.js
Unable to resolve module createReactNativeComponentClass from [project_path]/node_modules/react-native-icons/FAKIconImage.ios.js
Unable to resolve module flattenStyle from [project_path]/node_modules/react-native-icons/FAKIconImage.ios.js
Unable to resolve module insetsDiffer from [project_path]/node_modules/react-native-icons/FAKIconImage.ios.js
Unable to resolve module invariant from [project_path]/node_modules/react-native-icons/FAKIconImage.ios.js
Unable to resolve module merge from [project_path]/node_modules/react-native-icons/FAKIconImage.ios.js
Unable to resolve module warning from [project_path]/node_modules/react-native-icons/FAKIconImage.ios.js
Unable to resolve module deepDiffer from [project_path]/node_modules/react-native-icons/FAKIconImage.ios.js
Unable to resolve module EdgeInsetsPropType from [project_path]/node_modules/react-native-icons/FAKIconImage.ios.js
Unable to resolve module NativeMethodsMixin from [project_path]/node_modules/react-native-icons/FAKIconImage.ios.js
Unable to resolve module NativeModules from [project_path]/node_modules/react-native-icons/FAKIconImage.ios.js
Unable to resolve module ReactPropTypes from [project_path]/node_modules/react-native-icons/FAKIconImage.ios.js
Unable to resolve module ImageResizeMode from [project_path]/node_modules/react-native-icons/FAKIconImage.ios.js
Unable to resolve module ImageStylePropTypes from [project_path]/node_modules/react-native-icons/FAKIconImage.ios.js
Unable to resolve module React from [project_path]/node_modules/react-native-icons/FAKIconImage.ios.js
Unable to resolve module ReactNativeViewAttributes from [project_path]/node_modules/react-native-icons/FAKIconImage.ios.js
Unable to resolve module StyleSheet from [project_path]/node_modules/react-native-icons/FAKIconImage.ios.js
Unable to resolve module StyleSheetPropType from [project_path]/node_modules/react-native-icons/FAKIconImage.ios.js
Unable to resolve module createReactNativeComponentClass from [project_path]/node_modules/react-native-icons/FAKIconImage.ios.js
Unable to resolve module flattenStyle from [project_path]/node_modules/react-native-icons/FAKIconImage.ios.js
Unable to resolve module insetsDiffer from [project_path]/node_modules/react-native-icons/FAKIconImage.ios.js
Unable to resolve module invariant from [project_path]/node_modules/react-native-icons/FAKIconImage.ios.js
Unable to resolve module merge from [project_path]/node_modules/react-native-icons/FAKIconImage.ios.js
Unable to resolve module warning from [project_path]/node_modules/react-native-icons/FAKIconImage.ios.js
Unable to resolve module deepDiffer from [project_path]/node_modules/react-native-icons/FAKIconImage.ios.js

brentvatne · 2015-06-30T17:11:58Z

I also had to install react-timer-mixin (which is not mentioned in the docs...it just says to use it).

Can you send a pull request for this please? I can merge right away

One of my dependencies is still having an issue, but I think that is an issue with that package. Basically, that package can't find any of the RN modules (I had to fork it and remove the RN peerDependency to even get it to install with the RC anyways...here is my fork of that https://github.com/tackk/react-native-icons).

What was the issue you were having with peerDependencies? I believe it should let you install anyways, but it will warn you if it you don't satisfy the dependency.

I will note: I am still getting the red screen with the methodQueue error (this does not happen with a "fresh" install, and I have tried restarting the packager, xcode, simulator, etc), but it only flashes then goes away.

Strange one there for @tadeuzagallo

dhrrgn · 2015-06-30T17:17:25Z

@brentvatne I will get a PR in there in a minute, here is the error regarding the peerDep:

pm ERR! Darwin 14.4.0
npm ERR! argv "node" "/usr/local/bin/npm" "update" "--save" "react-native"
npm ERR! node v0.12.4
npm ERR! npm  v2.10.1
npm ERR! code EPEERINVALID

npm ERR! peerinvalid The package react-native does not satisfy its siblings' peerDependencies requirements!
npm ERR! peerinvalid Peer react-native-icons@0.1.0 wants react-native@>=0.5.0 <1.0.0

Edit: I have this sneaking suspicion I may be doing something completely wrong, and all of this is because I am being stupid ha.

dhrrgn · 2015-06-30T17:26:46Z

@brentvatne #1811

amasad · 2015-06-30T18:06:42Z

I also had to install react-timer-mixin (which is not mentioned in the docs...it just says to use it).

Yes, I'm sure it was installed somewhere before, it was never bundled with react-native. Thanks for the PR.

NativeModules is an internal module, it was never intended to be required by external modules. To reference something in react-native they should have it as a peerDependency and do require('react-native').NativeModules. It still works because I didn't want it to be a breaking change, but will break in the future. I'll open issues on the packages you mentioned.

here is the error regarding the peerDep:

This just says that the package expects a certain version of react-native to be installed and what you have installed doesn't satisfy the condition: react-native@>=0.5.0 <1.0.0

The new version of the packager doesn't let you reach into the private module namespace of react-native so go through the public interface.

amasad · 2015-06-30T18:19:34Z

I opened an issue for react-native-icons and luckily @ide fixed react-native-keyboardevents johanneslumpe/react-native-keyboardevents@5e57191

Is there a way to reach out to more library authors and inform them of this change?

dhrrgn · 2015-06-30T18:25:40Z

@amasad Thanks for the clarification there. I would say a mention in the changelog under "Breaking Changes" would be sufficient, as that would have removed much of my confusion on this issue.

We can close this issue now if we like. I am still not sure about the methodQueue error though, so we can possibly keep it open for that, or I can create a separate issue for that.

amasad · 2015-06-30T18:36:12Z

@dhrrgn I didn't know hotlinking into private modules was that prevalent but it's not breaking yet. Although it's a warning and not an error

@vjeux Can you update the changelog to mention that hotlinking into private modules is no longer allowed?

dhrrgn · 2015-06-30T19:06:43Z

@amasad It is prevalent because that is how the docs show us how to do it. See the iOS Calendar Module Example as well as in the Styles Section of the Native Components docs. This is may be worth its own section on that page (or at least a prominent note).

dhrrgn · 2015-06-30T20:01:48Z

@amasad @brentvatne I have figured out that the methodQueue error only happens when I get the warnings about the unresolved modules, so this is somehow connected to that.

Also, there is a larger issue here in that many of the "internal" modules commonly used by native components / modules are not yet available via the react-native public interface.

I updated react-native-video the best I could, and still, there are a good number of unexposed modules being used (therefor, a lot of warnings). TheWidlarzGroup/react-native-video#71

mnylen · 2015-07-02T18:45:56Z

@amasad, @brentvatne, @dhrrgn I did some bisecting and commit 4ac5c7e seems to cause issues at least with react-native-icons (error message: Requiring unknown module FAKIconImage. If you are sure the module is there, try restarting the packager).

In the previous commit 0898bb4 a simple require('FAKIconImage') still works.

mattmo · 2015-07-02T19:55:54Z

@mnylen - we're seeing a similar error with a require('cssVar') inside the react-native-navbar package. this error exists with both react-native 0.7 rc1 (which does not include 4ac5c7e) and rc2 (which does).

mnylen · 2015-07-02T20:06:46Z

Yeah, 4ac5c7e is not the real problem. It's 2d4055e

I was able to pinpoint the exact location:

redirectRequire in packager/react-packager/src/DependencyResolver/Package.js seems to return FAKIconImage when doing require('FAKIconImage')

If I change the lines 47-50 from this:

if (!browser || typeof browser !== 'object') {
    return name;
}

to this:

if (!browser || typeof browser !== 'object') {
    if (name === "FAKIconImage") { return "react-native-icons"; }
   return name;
}

I'm able to require('FAKIconImage') correctly. This is obviously not a real solution.

ide · 2015-07-02T20:12:54Z

What code is trying to reqiure FAKIconImage? Is it code within react-native-icons or your own app code? If it's the latter, requiring react-native-icons is the right solution.

mnylen · 2015-07-02T20:13:47Z

HEUREKA. So instead of FAKIconImage require I should do this in my own code:

const FAKIconImage = require('react-native-icons')

The package.json for react-native-icons defines FAKIconImage.ios.js as the main script for the package
Previously the react-native-packager has resolved FAKIconImage correctly to react-native-icons package

mnylen · 2015-07-02T20:16:35Z

@ide, my own. It was the react-native-icon's documented way of using it. So, it seems this might be a react-native-icons issue (and probably the same in other 3rd party libraries).

Though, might be a good idea to document that packager can't resolve requires like that anymore from app code.

mattmo · 2015-07-02T20:23:40Z

For our case, the require is in the third party package. This is the specific line that's causing the red screen above:

https://github.com/Kureev/react-native-navbar/blob/master/index.js#L15

This works fine with react-native 0.5. I haven't tested with react-native 0.6 but I can if that's helpful.

ide · 2015-07-02T20:37:17Z

@mnylen react-native-icons should update its docs to recommend Node-style requires. Maybe open up an issue or PR over there?

@mattmo No need to test -- react-native-navbar needs to be updated to require react-native-icons directly.

mnylen · 2015-07-02T20:42:28Z

@dhrrgn, if you're interested, I got this resolved in my own fork of react-native-icons for now: https://github.com/mnylen/react-native-icons/tree/0.7-support

The methodQueue error still flashes when reloading, but it goes away. Adding the suggested @synthesize methodQueue = _methodQueue; line does not help.

mnylen · 2015-07-02T20:52:04Z

@ide, yeah, I agree with you. Already done at corymsmith/react-native-icons#59

However, I still think this is a breaking change in the packager and should be documented, because it seems other 3rd libraries are affected too. :)

ide · 2015-07-02T21:15:16Z

@mnylen I've added a couple notes to the Breaking Changes section of the release notes: https://github.com/facebook/react-native/releases/tag/v0.7.0-rc. There was one mention of the change but I've expanded on it a bit. The examples have been updated to use var {X} = require('react-native') instead of var X = require('X') when using RN's own modules: 14fef64

amasad · 2015-07-03T02:38:11Z

I'll be more careful in the future. We actually never recommended using providesModule outside the react native codebase because it's non-standard, and relies on a global namespace which is bad for the obvious reasons. Thanks for your help with this.

mnylen · 2015-07-04T19:36:40Z

@amasad, I found another 3rd party library that doesn't work with the new packager: https://github.com/naoufal/react-native-safari-view

This time it doesn't seem like incorrect use of requires though. I had require('react-native-safari-view') in my code and the main script for react-native-safari-view in package.json points to SafariViewManager.ios.js, which the packager should find, I think.

I did some testing and renamed SafariViewManager.ios.js as index.ios.js + changed the main to that, and this time packager found it.

Isn't having different main script than 'index.js' valid?

yamill · 2015-07-06T18:06:00Z

I was having this same issue when I updated to 0.6.

I ended up doing a clean install of react-native and reinstalling all the modules and then it worked for me just fine.

I just had to transfer all my code all over again to the new folder.

krishpop · 2015-07-17T09:09:44Z

I have tried to do a clean install of all of the modules and I still get this error. Is this error an issue with 3rd part React Native components or is it something wrong with my development environment?

amasad · 2015-09-08T08:12:53Z

The issue, as discussed above, that the some 3rd party libraries are using internal modules. They should require things through require('react-native') We've opened issues at those libraries' issue tracker. Let me know if there is anything else I can do.

YonasBerhe · 2015-11-18T00:02:04Z

I know this is a different repo, but the issue I'm having is relatively the same @adamjmcgrath naoufal/react-native-speech#8

brentvatne changed the title ~~Module resolution issues after 0.7.0-rc.2 upgrade.~~ [Bridge & Packager] Module resolution issues after 0.7.0-rc.2 upgrade. Jun 30, 2015

brentvatne assigned tadeuzagallo Jun 30, 2015

amasad mentioned this issue Jun 30, 2015

Requiring internal react-native modules will stop working corymsmith/react-native-icons#59

Closed

brentvatne mentioned this issue Jun 30, 2015

[Public Interface] Create whitelist internal modules that need to be exposed publicly #1821

Closed

aljs mentioned this issue Jul 2, 2015

NativeModules dependency fix for RN 0.7 Shuangzuan/RCTRefreshControl#10

Merged

mnylen mentioned this issue Jul 4, 2015

0.7 support naoufal/react-native-safari-view#1

Merged

dvcrn mentioned this issue Jul 6, 2015

[0.7.0rc] RNOverlayManager is returning nil for it's methodQueue, which is not permitted. (...) brentvatne/react-native-overlay#10

Closed

This was referenced Jul 6, 2015

Packager starts throws a lot of errors after upgrading to 0.6 #1881

Closed

New Packager config for accessing react-native internal modules. Kureev/react-native-side-menu#64

Closed

Cannot find module 'FAKIconImage' corymsmith/react-native-icons#63

Closed

superlbr mentioned this issue Jul 17, 2015

Unable to resolve module NativeModules from /node_modules/react-native-cookies/index.js...etc joeferraro/react-native-cookies#4

Closed

naoufal mentioned this issue Jul 23, 2015

react-tween-state stop working naoufal/react-native-accordion#5

Closed

d-vine mentioned this issue Jul 25, 2015

Bundler can't resolve dependecies (or can it?) TheWidlarzGroup/react-native-video#80

Closed

jedlau mentioned this issue Jul 29, 2015

Unable to resolve module NativeModules from /path/to/react-native-simple-auth/lib/simpleauthclient.js adamjmcgrath/react-native-simple-auth#7

Closed

RoryCombe mentioned this issue Aug 8, 2015

Change require to not access NativeModules directly, but rather via "… devfd/react-native-geocoder#1

Merged

amasad closed this as completed Sep 8, 2015

This was referenced Sep 15, 2015

Require NativeModules via React Native package stefalda/ReactNativeLocalization#11

Merged

Require NativeModules via React Native package silentcloud/react-native-clipboard#1

Merged

jamesfzhang mentioned this issue Oct 1, 2015

Requiring internal react-native modules will stop working itinance/react-native-fs#15

Merged

BilalBudhani mentioned this issue Oct 3, 2015

Load Dimensions from React module instead of direct require ladas-larry/react-native-responsive-image#1

Merged

jordanbyron mentioned this issue Oct 16, 2015

Implement initialGesture jordanbyron/react-native-quick-actions#5

Closed

facebook locked as resolved and limited conversation to collaborators Jul 22, 2018

react-native-bot unassigned tadeuzagallo Jul 22, 2018

react-native-bot added the Resolution: Locked This issue was locked by the bot. label Jul 22, 2018

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

[Bridge & Packager] Module resolution issues after 0.7.0-rc.2 upgrade. #1808

[Bridge & Packager] Module resolution issues after 0.7.0-rc.2 upgrade. #1808

dhrrgn commented Jun 30, 2015

brentvatne commented Jun 30, 2015

dhrrgn commented Jun 30, 2015

brentvatne commented Jun 30, 2015

dhrrgn commented Jun 30, 2015

dhrrgn commented Jun 30, 2015

brentvatne commented Jun 30, 2015

dhrrgn commented Jun 30, 2015

dhrrgn commented Jun 30, 2015

amasad commented Jun 30, 2015

amasad commented Jun 30, 2015

dhrrgn commented Jun 30, 2015

amasad commented Jun 30, 2015

dhrrgn commented Jun 30, 2015

dhrrgn commented Jun 30, 2015

mnylen commented Jul 2, 2015

mattmo commented Jul 2, 2015

mnylen commented Jul 2, 2015

ide commented Jul 2, 2015

mnylen commented Jul 2, 2015

mnylen commented Jul 2, 2015

mattmo commented Jul 2, 2015

ide commented Jul 2, 2015

mnylen commented Jul 2, 2015

mnylen commented Jul 2, 2015

ide commented Jul 2, 2015

amasad commented Jul 3, 2015

mnylen commented Jul 4, 2015

yamill commented Jul 6, 2015

krishpop commented Jul 17, 2015

amasad commented Sep 8, 2015

YonasBerhe commented Nov 18, 2015

[Bridge & Packager] Module resolution issues after 0.7.0-rc.2 upgrade. #1808

[Bridge & Packager] Module resolution issues after 0.7.0-rc.2 upgrade. #1808

Comments

dhrrgn commented Jun 30, 2015

brentvatne commented Jun 30, 2015

dhrrgn commented Jun 30, 2015

brentvatne commented Jun 30, 2015

dhrrgn commented Jun 30, 2015

dhrrgn commented Jun 30, 2015

brentvatne commented Jun 30, 2015

dhrrgn commented Jun 30, 2015

dhrrgn commented Jun 30, 2015

amasad commented Jun 30, 2015

amasad commented Jun 30, 2015

dhrrgn commented Jun 30, 2015

amasad commented Jun 30, 2015

dhrrgn commented Jun 30, 2015

dhrrgn commented Jun 30, 2015

mnylen commented Jul 2, 2015

mattmo commented Jul 2, 2015

mnylen commented Jul 2, 2015

ide commented Jul 2, 2015

mnylen commented Jul 2, 2015

mnylen commented Jul 2, 2015

mattmo commented Jul 2, 2015

ide commented Jul 2, 2015

mnylen commented Jul 2, 2015

mnylen commented Jul 2, 2015

ide commented Jul 2, 2015

amasad commented Jul 3, 2015

mnylen commented Jul 4, 2015

yamill commented Jul 6, 2015

krishpop commented Jul 17, 2015

amasad commented Sep 8, 2015

YonasBerhe commented Nov 18, 2015