Exponent example doesn't work with yarn

[julienvincent]

So I'm attempting to get the example running on my local machine but am having trouble running the example on my iOS sim.

On the device I get the following error: undefined is not an object (evaluating 'meta.fileHashes')

And in Exponent logs I am getting the following stack:

Possible Unhandled Promise Rejection (id: 0):
null is not an object (evaluating 'prevComponentInstance._currentElement')
_updateRenderedComponent@http://packager.qv-ebq.julienvincent.example.exp.direct:80/main.bundle?platform=ios&dev=true&strict=false&minify=false&hot=false&assetPlugin=exponent/tools/hashAssetFiles&includeAssetFileHashes=true:18782:46
_performComponentUpdate@http://packager.qv-ebq.julienvincent.example.exp.direct:80/main.bundle?platform=ios&dev=true&strict=false&minify=false&hot=false&assetPlugin=exponent/tools/hashAssetFiles&includeAssetFileHashes=true:18763:30
updateComponent@http://packager.qv-ebq.julienvincent.example.exp.direct:80/main.bundle?platform=ios&dev=true&strict=false&minify=false&hot=false&assetPlugin=exponent/tools/hashAssetFiles&includeAssetFileHashes=true:18682:29
performUpdateIfNecessary@http://packager.qv-ebq.julienvincent.example.exp.direct:80/main.bundle?platform=ios&dev=true&strict=false&minify=false&hot=false&assetPlugin=exponent/tools/hashAssetFiles&includeAssetFileHashes=true:18590:21
performUpdateIfNecessary@http://packager.qv-ebq.julienvincent.example.exp.direct:80/main.bundle?platform=ios&dev=true&strict=false&minify=false&hot=false&assetPlugin=exponent/tools/hashAssetFiles&includeAssetFileHashes=true:16775:42
runBatchedUpdates@http://packager.qv-ebq.julienvincent.example.exp.direct:80/main.bundle?platform=ios&dev=true&strict=false&minify=false&hot=false&assetPlugin=exponent/tools/hashAssetFiles&includeAssetFileHashes=true:16386:41
perform@http://packager.qv-ebq.julienvincent.example.exp.direct:80/main.bundle?platform=ios&dev=true&strict=false&minify=false&hot=false&assetPlugin=exponent/tools/hashAssetFiles&includeAssetFileHashes=true:17122:16
perform@http://packager.qv-ebq.julienvincent.example.exp.direct:80/main.bundle?platform=ios&dev=true&strict=false&minify=false&hot=false&assetPlugin=exponent/tools/hashAssetFiles&includeAssetFileHashes=true:17122:16
flushBatchedUpdates@http://packager.qv-ebq.julienvincent.example.exp.direct:80/main.bundle?platform=ios&dev=true&strict=false&minify=false&hot=false&assetPlugin=exponent/tools/hashAssetFiles&includeAssetFileHashes=true:16408:20
flushBatchedUpdates@[native code]
closeAll@http://packager.qv-ebq.julienvincent.example.exp.direct:80/main.bundle?platform=ios&dev=true&strict=false&minify=false&hot=false&assetPlugin=exponent/tools/hashAssetFiles&includeAssetFileHashes=true:17188:19
perform@http://packager.qv-ebq.julienvincent.example.exp.direct:80/main.bundle?platform=ios&dev=true&strict=false&minify=false&hot=false&assetPlugin=exponent/tools/hashAssetFiles&includeAssetFileHashes=true:17135:14
batchedUpdates@http://packager.qv-ebq.julienvincent.example.exp.direct:80/main.bundle?platform=ios&dev=true&strict=false&minify=false&hot=false&assetPlugin=exponent/tools/hashAssetFiles&includeAssetFileHashes=true:34017:20
enqueueUpdate@http://packager.qv-ebq.julienvincent.example.exp.direct:80/main.bundle?platform=ios&dev=true&strict=false&minify=false&hot=false&assetPlugin=exponent/tools/hashAssetFiles&includeAssetFileHashes=true:16436:32
enqueueUpdate@http://packager.qv-ebq.julienvincent.example.exp.direct:80/main.bundle?platform=ios&dev=true&strict=false&minify=false&hot=false&assetPlugin=exponent/tools/hashAssetFiles&includeAssetFileHashes=true:28693:27
enqueueSetState@http://packager.qv-ebq.julienvincent.example.exp.direct:80/main.bundle?platform=ios&dev=true&strict=false&minify=false&hot=false&assetPlugin=exponent/tools/hashAssetFiles&includeAssetFileHashes=true:28878:14
setState@http://packager.qv-ebq.julienvincent.example.exp.direct:80/main.bundle?platform=ios&dev=true&strict=false&minify=false&hot=false&assetPlugin=exponent/tools/hashAssetFiles&includeAssetFileHashes=true:9780:29
_callee2$@http://packager.qv-ebq.julienvincent.example.exp.direct:80/main.bundle?platform=ios&dev=true&strict=false&minify=false&hot=false&assetPlugin=exponent/tools/hashAssetFiles&includeAssetFileHashes=true:1604:15
tryCatch@http://packager.qv-ebq.julienvincent.example.exp.direct:80/main.bundle?platform=ios&dev=true&strict=false&minify=false&hot=false&assetPlugin=exponent/tools/hashAssetFiles&includeAssetFileHashes=true:24056:33
invoke@http://packager.qv-ebq.julienvincent.example.exp.direct:80/main.bundle?platform=ios&dev=true&strict=false&minify=false&hot=false&assetPlugin=exponent/tools/hashAssetFiles&includeAssetFileHashes=true:24330:20
tryCatch@http://packager.qv-ebq.julienvincent.example.exp.direct:80/main.bundle?platform=ios&dev=true&strict=false&minify=false&hot=false&assetPlugin=exponent/tools/hashAssetFiles&includeAssetFileHashes=true:24056:33
invoke@http://packager.qv-ebq.julienvincent.example.exp.direct:80/main.bundle?platform=ios&dev=true&strict=false&minify=false&hot=false&assetPlugin=exponent/tools/hashAssetFiles&includeAssetFileHashes=true:24132:20
http://packager.qv-ebq.julienvincent.example.exp.direct:80/main.bundle?platform=ios&dev=true&strict=false&minify=false&hot=false&assetPlugin=exponent/tools/hashAssetFiles&includeAssetFileHashes=true:24140:7
tryCallOne@http://packager.qv-ebq.julienvincent.example.exp.direct:80/main.bundle?platform=ios&dev=true&strict=false&minify=false&hot=false&assetPlugin=exponent/tools/hashAssetFiles&includeAssetFileHashes=true:26109:10
http://packager.qv-ebq.julienvincent.example.exp.direct:80/main.bundle?platform=ios&dev=true&strict=false&minify=false&hot=false&assetPlugin=exponent/tools/hashAssetFiles&includeAssetFileHashes=true:26195:19
callTimer@http://packager.qv-ebq.julienvincent.example.exp.direct:80/main.bundle?platform=ios&dev=true&strict=false&minify=false&hot=false&assetPlugin=exponent/tools/hashAssetFiles&includeAssetFileHashes=true:5562:9
callImmediatesPass@http://packager.qv-ebq.julienvincent.example.exp.direct:80/main.bundle?platform=ios&dev=true&strict=false&minify=false&hot=false&assetPlugin=exponent/tools/hashAssetFiles&includeAssetFileHashes=true:5661:28
callImmediates@http://packager.qv-ebq.julienvincent.example.exp.direct:80/main.bundle?platform=ios&dev=true&strict=false&minify=false&hot=false&assetPlugin=exponent/tools/hashAssetFiles&includeAssetFileHashes=true:5676:43
guard@http://packager.qv-ebq.julienvincent.example.exp.direct:80/main.bundle?platform=ios&dev=true&strict=false&minify=false&hot=false&assetPlugin=exponent/tools/hashAssetFiles&includeAssetFileHashes=true:3875:3
__callImmediates@http://packager.qv-ebq.julienvincent.example.exp.direct:80/main.bundle?platform=ios&dev=true&strict=false&minify=false&hot=false&assetPlugin=exponent/tools/hashAssetFiles&includeAssetFileHashes=true:3997:6
http://packager.qv-ebq.julienvincent.example.exp.direct:80/main.bundle?platform=ios&dev=true&strict=false&minify=false&hot=false&assetPlugin=exponent/tools/hashAssetFiles&includeAssetFileHashes=true:3964:24
guard@http://packager.qv-ebq.julienvincent.example.exp.direct:80/main.bundle?platform=ios&dev=true&strict=false&minify=false&hot=false&assetPlugin=exponent/tools/hashAssetFiles&includeAssetFileHashes=true:3875:3
invokeCallbackAndReturnFlushedQueue@http://packager.qv-ebq.julienvincent.example.exp.direct:80/main.bundle?platform=ios&dev=true&strict=false&minify=false&hot=false&assetPlugin=exponent/tools/hashAssetFiles&includeAssetFileHashes=true:3962:6
invokeCallbackAndReturnFlushedQueue@[native code]

[satya164]

@julienvincent That's weird. Exponent example works fine for me here. Will check again in a minute.

cc @skevy @brentvatne any idea what's happening?

[julienvincent]

I'm in the process now of nuking and reinstalling. Internet is in the drain so this gonna take some time :-<

[satya164]

@julienvincent Use yarn :)

[julienvincent]

I did initially, thats why I'm using npm now to see if it was maybe yarns fault

[julienvincent]

Hmm, npm i in /example hangs with no output or loader.

[satya164]

Try with --verbose maybe? Must be the connection

[satya164]

I'm running rm -rf node_modules && yarn to see if I can repro it

[julienvincent]

ran with --verbose, it gets to this point and then hangs:

npm verb afterAdd /Users/julienvincent/.npm/react/15.3.1/package/package.json written

Doesn't look like connection issue but perhaps.

[julienvincent]

Gave up on the npm i. Current have a node_modules populated with npm in root and a node_modules populated with yarn in example. Still get the undefined error.

Exponent outputs this when running the packager:

Problem checking node_modules dependencies. Could not run `npm ls` in /Users/julienvincent/code/react-native-tab-view/example.

I have a feeling that the problem with running the example and the problem with npm i might be linked?

[satya164]

ok, so seems the example doesn't work with yarn. but rm -rf node_modules && npm i --cache-min 999999 works fine.

[satya164]

I just republished the example to exponent successfully at https://getexponent.com/@satya164/react-native-tab-view-demos

seems some issue with your machine and npm?

[julienvincent]

Ok cool so I just need to get it going with npm. 👍 Will try with cache

[julienvincent]

Still hanging :< what node version are you running?

[satya164]

@julienvincent Weird. I've 5.12.0

[julienvincent]

Let me try v5. I'm running 6.7

[julienvincent]

Ah - v5 is no longer hanging. Still gonna take me some time due to bad internet but I can see that it is actually downloading now. Can you try use v6 and confirm that it's not just my machine?

[satya164]

@julienvincent Ok, will do. Weird that v6 won't work

[julienvincent]

@satya164 Ok so the install finished - example is working well but not gonna close this quite yet - We should figure out why it isn't working with yarn. I think the hanging on node 6 is most likely just due to my machine/web, but it would be good to get this working with yarn. probably just a missing dep install or something

[satya164]

It's a yarn issue with local and git dependencies. So I'm going to close this one.

[julienvincent]

Is it resolvable though? It would be nice to be able to use yarn with this.

[satya164]

@julienvincent unfortunately it has to be fixed in yarn. we can't do anything to fix it.

yarn works fine with react-native-tab-view though. Just that the example doesn't work.

[julienvincent]

@satya164 Can you describe which package.json properties within this project are causing the issue? I'm asking as I have used git packages with yarn before with no problem and would like to isolate this and open an issue with yarn if needed.

[satya164]

@julienvincent I've seen that yarn caches packages according to just the version, irrespective of where it's installed from. For example, if it has a cache of react-native version 0.39, then when you point it to a git repo with the version 0.39, it'll install the cached version and not the one from git. Same for local packages, it installs cached version and not the actual local files. It will work with packages from GIT if you always change the version when you change something. I think I had seen these issues in yarn repo.

[satya164]

yarnpkg/yarn#2165

[satya164]

yarnpkg/yarn#1573

[julienvincent]

Ah I see. 👍 Lets hope it gets 'fixed' or changed soon.