You know when you’ve been so productive, but then you suddenly run into some really obscure bug that no one knows how to fix? Well today was one of those days. It was pretty frustrating to see that Expo was stuck on the splash screen. I’ve been using Expo lately and I wanted to get acquainted with React Navigation. It was working fine until I installed a package and removed it. At that point I was getting errors like such:
Unable to symbolicate stack trace: The stack is null
So I thought maybe there was some caching weirdness going on with Expo, so I tried clearing the bundler cache, but that didn’t work. I tried to drop my node_modules folder and npm install everything again. That didn’t work. I thought maybe my Expo app had some cache too. I deleted it and reinstalled it. Perhaps the remote debugger was being weird, so I disabled that. NO DICE.
So I started Googling to see what others have done. They said to run expo start --no-dev --minify. Same behavior. Someone said to uninstall the splash screen module. So I did a global search for it and found that it was referenced in the yarn lock file. I tried to uninstall it, but yarn complained about the following:
Running this command will add the dependency to the workspace root rather than the workspace itself, which might not be what you want - if you really meant it, make it explicit by running this command again with the -W flag (or --ignore-workspace-root-check).
I’ve never seen the error before and I didn’t know what Yarn Workspaces were, so I did some more googling that got me to this Stack Overflow page.
After reading one of the answers I had a hunch at what was going on. Basically Yarn Workspaces allow you to install packages for multiple package.json’s under one root workspace path with just one yarn install command and it’ll resolve dependencies so that they aren’t duplicated. So instead of running npm install under multiple paths, you just do it in the project root.
To confirm that I had Yarn Workspaces I checked my package.json.
Low and behold I found this line…
"workspaces": {
"packages": [
"packages/*",
"example"
]
},
And it all made sense. I had the following path structure.
project-root/
-- node_modules
-- example
---- node_modules
---- package.json
---- package-lock.json (here because I ran npm install at this path)
-- package.json
-- yarn.lock
After dropping the all the node_modules folders in the project and running yarn install in the root my app was running fine again.
Solving A Bug That's Never Been Solved Before
So my two biggest clues from all of this was when exactly did my application stop working? When I removed the package.
What was its current behavior and how did that differ to its past and in relation to other apps? Expo, didn’t show the Running application on iPhone. message in the terminal. It only got as far as compiling the JavaScript bundle.
Those were the two biggest clues that let me to figure this all out.
The Core Issue?
Basically my dependencies were not in sync and Expo was failing silently.
Liked this post? You might like this other post about React Native.