HeadlinesBriefing favicon HeadlinesBriefing.com

Fixing Expo pnpm Workspaces Issues

DEV Community •
×

Developers wrestling with monorepos face a common headache: getting Expo to play nicely with pnpm workspaces. A developer shared their hard-won configuration guide, tackling the messy reality of mixed React and React Native projects. Their solution centers on a custom metro.config.js file, which becomes essential when standard setups break down. The core challenge involves managing how Metro resolves packages across the complex virtual store structure that pnpm creates, a frequent source of build failures.

The most notorious issue is the dreaded Invalid hook call error. This happens when multiple versions of React load simultaneously, a classic monorepo trap. The fix involves singleton pinning, forcing Expo and React Native packages to resolve to a single instance. Another major hurdle involves missing transitive dependencies, which requires enabling symlinks in Metro's resolver. This tells the bundler to follow pnpm's virtual store paths instead of getting lost.

Beyond symlinks, the guide warns against using `disableHierarchicalLookups: true`, a setting that completely breaks pnpm's package discovery. For non-transitive dependencies, the author insists on using `npx expo install`. This isn't just a convenience; it guarantees version compatibility between your packages and the Expo SDK. Skipping this step often leads to subtle, frustrating bugs that are hard to trace back to mismatched dependencies.

Getting this configuration right is critical for modern teams adopting pnpm's speed and efficiency. While the setup demands careful attention to Metro's resolver settings, the payoff is a stable, fast monorepo workflow. Developers must balance singleton control, symlink enablement, and proper CLI usage to avoid the common pitfalls. This approach transforms a brittle setup into a reliable foundation for complex apps.