[0.18] Error: Naming collision detected

[sampurcell93]

Hi there, I just updated my RN package to 0.18, and then I ran a react-native upgrade. However, there seems to be a problem starting the packager:

Error building DependencyGraph:
 Error: Naming collision detected: /Users/samuelpurcell/Projects/Cymbal-Android/node_modules/fbjs/flow/include/warning.js collides with /Users/samuelpurcell/Projects/Cymbal-Android/node_modules/fbjs/lib/warning.js
    at HasteMap._updateHasteMap (HasteMap.js:132:13)
    at HasteMap.js:103:28
    at tryCallOne (/Users/samuelpurcell/Projects/Cymbal-Android/node_modules/promise/lib/core.js:37:12)
    at /Users/samuelpurcell/Projects/Cymbal-Android/node_modules/promise/lib/core.js:123:15
    at flush (/Users/samuelpurcell/Projects/Cymbal-Android/node_modules/asap/raw.js:50:29)
    at nextTickCallbackWith0Args (node.js:456:9)
    at process._tickCallback (node.js:385:13)

I have tried fixing problems with the watchman cache, using the --reset-cache option, and the rm -rf $TMPDIR/react-packager-* method. Additionally, I have looked into this specific error, but I can only find examples where it is the result of a collision between and extra node_modules/react-native/node_modules directory and others... this seems to be a more fundamental problem. Any advice would be appreciated.

Running node 5.4.0 and npm 3.3.12.

[facebook-github-bot]

Hey sampurcell93, thanks for reporting this issue!

React Native, as you've probably heard, is getting really popular and truth is we're getting a bit overwhelmed by the activity surrounding it. There are just too many issues for us to manage properly.

• If you don't know how to do something or something is not working as you expect but not sure it's a bug, please ask on StackOverflow with the tag react-native or for more real time interactions, ask on Discord in the #react-native channel.
• If this is a feature request or a bug that you would like to be fixed, please report it on Product Pains. It has a ranking feature that lets us focus on the most important issues the community is experiencing.
• We welcome clear issues and PRs that are ready for in-depth discussion. Please provide screenshots where appropriate and always mention the version of React Native you're using. Thank you for your contributions!

[chirag04]

@sampurcell93 can you try the steps here: #5390 (comment) and see if it works for you

[rreusser]

I tried the fixes listed in #5390, but commenting here since the title is a more accurate description. I'm also getting a lot of similar errors regarding fbjs and react. E.g.:

Error: Naming collision detected: /Users/rreusser/project-name/node_modules/react-native/node_modules/react/lib/AutoFocusUtils.js collides with /Users/rreusser/project-name/node_modules/react/lib/AutoFocusUtils.js

It seems perhaps related to Use React from NPM - 5bf1f4c, but it's unclear quite how, and not quite clear what to do about it. I've tried manually deleting deeply nested node_modules in order to get over the hump and see how this might be fixed, but to no avail.

[rreusser]

A new day. Simply removing react as a dependency fixed my issue immediately. The flow-related fbjs issue may or may not have an identical cause.

[mauron85]

Same here. I was upgrading from 0.17.

Ran react-native upgrade. I've removed node_modules dir. Then npm install (reported no errors)

node v5.4.0
npm 2.14.15
OSX 10.11.3

 Error: Naming collision detected: /Users/finch/dev/mapilary/Courier/node_modules/react/node_modules/fbjs/lib/shallowEqual.js collides with /Users/finch/dev/mapilary/Courier/node_modules/react-native/node_modules/fbjs/lib/shallowEqual.js
    at HasteMap._updateHasteMap (HasteMap.js:132:13)
    at HasteMap.js:103:28
    at tryCallOne (/Users/finch/dev/mapilary/Courier/node_modules/react-native/node_modules/promise/lib/core.js:37:12)
    at /Users/finch/dev/mapilary/Courier/node_modules/react-native/node_modules/promise/lib/core.js:123:15
    at flush (/Users/finch/dev/mapilary/Courier/node_modules/react-native/node_modules/promise/node_modules/asap/raw.js:50:29)
    at nextTickCallbackWith0Args (node.js:456:9)
    at process._tickCallback (node.js:385:13)
~
Process terminated. Press <enter> to close the window

[rreusser]

@mauron85 what does your package.json look like? Do you have react as a dependency? I think react is now pulled in by RN. See:

react-native/package.json

Line 109 in aee11c0

"react": "^0.14.5",

vs

react-native/package.json

Line 106 in 30999e3

"promise": "^7.0.4",

[mauron85]

{
  "name": "Courier",
  "version": "2.0.0",
  "private": true,
  "scripts": {
    "start": "node node_modules/react-native/local-cli/cli.js start"
  },
  "dependencies": {
    "moment": "^2.11.0",
    "react-native": "^0.18.1",
    "react-native-background-geolocation": "^0.3.3",
    "react-native-communications": "^0.1.0",
    "react-native-i18n": "0.0.7",
    "react-native-orientation": "^1.12.2",
    "react-native-progress-circular": "0.0.5",
    "react-native-pull-to-refresh": "^1.0.1",
    "react-native-search-bar": "^2.8.0",
    "react-native-simple-store": "^0.1.0",
    "react-native-vector-icons": "^1.0.4",
    "react-timer-mixin": "^0.13.3",
    "reflux": "^0.3.0",
    "socket.io-client": "^1.3.7",
    "underscore": "^1.8.3"
  }
}

[mauron85]

I should say. My OSX has case sensitive fs. Should not be problem. Just sayin ... :-)

[rreusser]

Hmm… then I'm not sure, but I'm pretty sure it comes down a duplicate dependency that's no longer necessary. Did you rm -rf node_modules and reinstall? I notice ./node_modules/react which is only there if react is a package dependency, right? (for npm version < 3, that is)

[mauron85]

Did you rm -rf node_modules and reinstall?

yes I did (no errors)

ll -l node_modules

drwxr-xr-x   2 finch  staff   136 Jan 21 19:07 .bin
drwxr-xr-x   4 finch  staff   374 Jan 21 19:04 moment
drwxr-xr-x   5 finch  staff   374 Jan 21 19:04 react
drwxr-xr-x   9 finch  staff   544 Jan 21 19:04 react-native
drwxr-xr-x   6 finch  staff   408 Jan 21 19:04 react-native-background-geolocation
drwxr-xr-x   2 finch  staff   238 Jan 21 19:04 react-native-communications
drwxr-xr-x   6 finch  staff   340 Jan 21 19:04 react-native-i18n
drwxr-xr-x   4 finch  staff   238 Jan 21 19:04 react-native-orientation
drwxr-xr-x   2 finch  staff   306 Jan 21 19:04 react-native-progress-circular
drwxr-xr-x   3 finch  staff   238 Jan 21 19:04 react-native-pull-to-refresh
drwxr-xr-x   5 finch  staff   578 Jan 21 19:04 react-native-search-bar
drwxr-xr-x   3 finch  staff   306 Jan 21 19:04 react-native-simple-store
drwxr-xr-x   9 finch  staff   952 Jan 21 19:04 react-native-vector-icons
drwxr-xr-x   3 finch  staff   408 Jan 21 19:04 react-timer-mixin
drwxr-xr-x   4 finch  staff   510 Jan 21 19:04 reflux
drwxr-xr-x   4 finch  staff   306 Jan 21 19:04 socket.io-client
drwxr-xr-x   2 finch  staff   272 Jan 21 19:04 underscore

[rreusser]

Hmm… this could be a red herring, but should react be there? If it's a dependency of react-native and not your package.json, it'd be in node_modules/react-native/node_modules/react, right?

[mauron85]

Usually yes. But I think npm is getting smarted and tries to put packages closest to the top of modules tree. More of them are shared with others and this saves memory. Don't blame if it's not true :-)

[rreusser]

npm3 does that, I think. You're using npm 2.14.15 so I'd expect those to be nested. But then I could be totally wrong. 😬

[rreusser]

Does the packager succeed if you just rm -rf node_modules/react?

[mauron85]

Just upgraded to npm3. Removed node_modules and reinstalled them. And I'm fine. Issue seems to be resolved.

node v5.4.0
npm 3.5.3
OSX 10.11.3

PS: react module is on top of the node_modules tree (same as for npm2)

[rreusser]

Cool. Not sure why it was in node_modules/ with npm2, but I guess the important thing is that it's not also nested.

@sampurcell93 did something along these lines fix your issue? Maybe a redundant dependency?

[Emibob]

@rreusser thanks I was having the same issue (using npm2) & the redundant dependency was the culprit

[rreusser]

Win! If the solution is searchable and the problem seems solvable with some dependency tweaks, can this issue perhaps be closed?

[bartonhammond]

@rreusser Since my upgrade to RN 0.18.1 has this error, am I correctly understanding that the answer is to:

1. npm install -g npm3
2. rm -rf node_modules
3. update package.json and remove react dependency
4. npm3 install

Thanks

[rreusser]

I'm not an expert but whichever package is giving the error (it's in the stack trace) seems to be installed more than once and haste map doesn't like that. It seems like maybe there's more than one source of this issue, but the solution seems the same: locate the duplicate copies. One of the packages probably doesn't need to be there. I didn't upgrade to npm3. Seems like maybe that works, but I'd try just resolving the duplicate first.

[bartonhammond]

1. npm install -g npm3
2. rm -rf node_modules
3. npm3 install

[EDIT] The above steps did work.

[aforty]

Sorry to bump, but I'm still having an issue and meanwhile RN 0.19.0 has been released.

I tried everything above: installing npm3, remove and reinstalling packages, clearing watchmen cache.

Error building DependencyGraph:
 Error: Naming collision detected: /Users/aforty/Code/dish-app/node_modules/react/node_modules/fbjs/lib/UserAgentData.js collides with /Users/aforty/Code/dish-app/node_modules/react-native/node_modules/fbjs/lib/UserAgentData.js
    at HasteMap._updateHasteMap (HasteMap.js:132:13)
    at HasteMap.js:103:28
    at tryCallOne (/Users/aforty/Code/dish-app/node_modules/promise/lib/core.js:37:12)
    at /Users/aforty/Code/dish-app/node_modules/promise/lib/core.js:123:15
    at flush (/Users/aforty/Code/dish-app/node_modules/asap/raw.js:50:29)
    at nextTickCallbackWith0Args (node.js:456:9)
    at process._tickCallback (node.js:385:13)

node: 5.4.0
npm: 3.7.2
os: os x 10.11.3

[bartonhammond]

You could look at my project setup, if that helps, https://github.com/bartonhammond/snowflake

[arik-so]

I'm having the same issues, tried all the steps above, and still can't get it working. Looking forward to a fix!

[Emibob]

This works for npm2, I'm not sure about npm3 @aforty & @arik-so

[arik-so]

@Emibob I tried with both npm2 and npm3.

[benoitc]

me either

[lamyju]

same issue for me.

When adding material-ui I get this issue.

RN v0.20
Node v4.3.1
NPM v3.7.3

Tried everything so far and no luck.

This is the error I get

ailed to build DependencyGraph: Naming collision detected: /Applications/MAMP/htdocs/xxxx/node_modules/react-tap-event-plugin/node_modules/fbjs/flow/include/warning.js collides with /Applications/MAMP/htdocs/xxxx/node_modules/react-tap-event-plugin/node_modules/fbjs/lib/warning.js
Error: Naming collision detected: /Applications/MAMP/htdocs/xxxx/node_modules/react-tap-event-plugin/node_modules/fbjs/flow/include/warning.js collides with /Applications/MAMP/htdocs/xxxx/node_modules/react-tap-event-plugin/node_modules/fbjs/lib/warning.js
at HasteMap._updateHasteMap (HasteMap.js:132:13)
at HasteMap.js:103:28
at tryCallOne (/Applications/MAMP/htdocs/xxxx/node_modules/promise/lib/core.js:37:12)
at /Applications/MAMP/htdocs/xxxx/node_modules/promise/lib/core.js:123:15
at flush (/Applications/MAMP/htdocs/xxxxx/node_modules/asap/raw.js:50:29)
at nextTickCallbackWith0Args (node.js:415:9)
at process._tickCallback (node.js:344:13)

Any ideas?

[benoitc]

using nodejs 4.3 fixed the issue above for me.

[chetstone]

I saw this issue using npm2. I saw this warning first:

npm WARN peerDependencies The peer dependency react@^0.14.0 included from react-redux will no
npm WARN peerDependencies longer be automatically installed to fulfill the peerDependency 
npm WARN peerDependencies in npm 3+. Your application will need to depend on it explicitly.

So npm 2 was installing react at the top level. cd node_modules; rm -fr react fixed it for me.

UPDATE: OOOPS! Spoke too soon. Now I've got a red box warning Unable to resolve module react … Invalid directory …/node_modules/react

[xubing]

plz use npm3 . after I use npm3 ,these is no error now.
And pay attention that removing the react in your package.json.

[benoitc]

npm3 don't solve the issue there. using nodejs 4.3 did.

[hackrole]

hi, everybody. I meet the same errors. I tried npm3 but not work.
But I found the error was because that: I named my project AsyncStorage which was the same will the package under react-native.
I remove my project which was just a demo. And recreate a new project name AsyncExample. and the same code.
I use npm not npm3. And it works now.

[kevando]

using npm3 install fixed my problem, but why? should i use that from now on instead of npm?

[ericnograles]

@kevando npm3 traverses your dependency graph a bit differently than npm 2. Specifically, it sort of flattens it out, so you wouldn't have an instance where you'd have react on your top level node_modules as well as under your react-native submodule, which causes the naming collision of fbjs.

I'm personally running npm (v2) alongside of npm3 as I do have some legacy projects still dependent on npm 2, but if you don't have that constraint, you may just want to upgrade your npm straight up to 3.x.

hth!

[jsierles]

As of the upcoming 0.22.0 release, React Native depends on both react and fbjs via npm, which should solve the duplicate dependency issues. Please give 0.22.0-rc a try!

We're closing out this issue - feel free to continue discussion, or reopen should this error persist on the latest versions of React Native.

[harde1]

fbjs duplicate ，del one of them