Loading…
Migrating from Apollo Tooling to GraphQL Codegen at Yelp
YelpIgor Kusakov, Software Engineer
Summary
Yelp migrated its frontend React monorepo from the deprecated apollo-tooling to GraphQL Codegen to ensure ongoing maintenance and build reliability. Because the monorepo spans over 500 packages with thousands of generated type files and custom nested type imports, the Client Data team prioritized a transparent migration that avoided codebase-wide changes. The team rejected approaches requiring syntax updates or altered import paths, choosing instead to configure GraphQL Codegen and contribute upstream plugin changes so output structures and naming conventions matched the legacy output. Migrating packages incrementally through small pull requests enabled continuous feedback while allowing developers across dozens of teams to maintain their workflows without editing existing code. Completing the migration to GraphQL Codegen v6 simplified Yelp's build tooling, eliminated deprecated dependencies, and left upstream compatibility enhancements available for the wider open-source community.
Context
Yelp relied on apollo-tooling to generate TypeScript types from GraphQL queries and mutations in its React monorepo. In April 2023, Apollo deprecated its CLI service commands and recommended migrating to GraphQL Codegen. With apollo-tooling reaching end of life, existing bugs were no longer resolved and diagnosing issues became difficult, requiring Yelp to adopt a supported replacement.
Approach / What changed
Yelp's Client Data team configured GraphQL Codegen to replicate apollo-tooling's output patterns, such as query-based file naming and inlined schema types, preserving thousands of existing imports across 500+ packages. Rather than relying on fragile post-processing scripts, the team upstreamed configuration capabilities to GraphQL Codegen plugins and migrated packages incrementally in batches to validate stability before removing the legacy tooling.
Takeaways
- Transparent tooling migrations in large monorepos prevent disruption across dozens of teams by keeping file structures and type signatures backwards-compatible.
- GraphQL Codegen default outputs diverged from apollo-tooling by using component-named files, external globalTypes imports, and combined field-and-type nested type names.
- Upstreaming custom plugin improvements to open-source dependencies eliminates private maintenance overhead and ensures long-term upgrade compatibility.
Related reading
Yelp ·
Optimizing Our Build Times by Migrating from Webpack to Rspack
As Yelp's JavaScript monorepo expanded over time, Webpack build speeds became a significant engineering bottleneck. To resolve this without rewriting complex configurations, the team selected Rspack for its direct compatibility with existing Webpack setups and plugins. Yelp implemented an adapter pattern to generate Rspack configurations dynamically from original Webpack files, enabling a staged opt-in rollout across development tools and CI environments. Following the initial migration, engineers addressed performance issues in barrel files using automated codemods to replace star re-exports and import-then-export patterns with named re-exports. Combined with Rspack's portable persistent caching, the migration reduced integration build times by approximately 52 percent and warm cache builds by up to 80 percent.
Benson Pan, Software EngineerYelp ·
Training Orchestrator: Unifying Model Training at Yelp