feat(hydrogen): support React Router 8#3813
Draft
fredericoo wants to merge 8 commits into
Draft
Conversation
Update Hydrogen, CLI, skeleton, and cookbook surfaces for React Router 8's React 19.2.7, Node 22.22, Vite 7+, ESM-only, and no react-router-dom baseline. Remove obsolete v8 future flags, move split route modules to the stable config surface, migrate meta data access to loaderData, and update CLI build output detection for RR8's server bundle layout. Also refresh cookbook recipes and docs so generated examples follow the RR8 dependency and context.get(hydrogenContext.*) patterns. Assisted-By: devx/c578cdc2-d220-4587-bb29-636977eb6de8
Scaffolded React Router 8 projects need the Hydrogen CLI implementation from their installed @shopify/cli-hydrogen package because @shopify/cli 3.93.2 still dispatches to its bundled older Hydrogen plugin. Add a direct shopify-hydrogen binary while preserving cli-hydrogen's create-app behavior, then point skeleton scripts at that local binary so build, dev, preview, and codegen use the matching CLI version. Assisted-By: devx/c578cdc2-d220-4587-bb29-636977eb6de8
React Router 8 builds write the worker bundle to the new server output path, but the deployed workflows were still dispatching through @shopify/cli 3.93.2 and its bundled older Hydrogen plugin. Use the local shopify-hydrogen binary in CI deploy steps so deploy uses the same @shopify/cli-hydrogen implementation as the scaffold scripts. Assisted-By: devx/c578cdc2-d220-4587-bb29-636977eb6de8
CI installs dependencies before building @shopify/cli-hydrogen, so pnpm cannot create a package bin that points directly at dist/bin.js. Add a checked-in shopify-hydrogen bin stub and include it in published files; the stub delegates to the built dist runner once the package build step has completed. Assisted-By: devx/c578cdc2-d220-4587-bb29-636977eb6de8
React Router 8 can resolve Vite's base outDir to dist while writing the server bundle under dist/server/index.js. Derive serverOutDir from serverOutFile so deploy uploads dist/server as the worker directory and dist/client as assets, matching the build output layout. Assisted-By: devx/c578cdc2-d220-4587-bb29-636977eb6de8
Contributor
|
Oxygen deployed a preview of your
Learn more about Hydrogen's GitHub integration. |
Scaffolded PR test apps install the currently published @shopify/cli-hydrogen package, which does not contain unreleased binaries from this branch. Pack the local CLI after the monorepo build and install that tarball into each generated test app before running its build script, so scaffolding CI exercises the PR's CLI implementation. Assisted-By: devx/c578cdc2-d220-4587-bb29-636977eb6de8
Scaffold tests for this branch need unreleased Hydrogen package metadata, not the versions currently published to npm. Skip the scaffold's initial dependency install, pack the built local Hydrogen packages, and install those tarballs into each generated test app before verifying its lockfile and build. Assisted-By: devx/c578cdc2-d220-4587-bb29-636977eb6de8
CI was still exercising published Hydrogen packages and stale recipe patches while this branch relies on unreleased React Router 8 package metadata. Install all local Hydrogen tarballs together for scaffold tests, refresh b2b patch context for RouterContextProvider access, and update brittle React 19 test assertions. Assisted-By: devx/c578cdc2-d220-4587-bb29-636977eb6de8
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
1 participant
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
Why
React Router 8 raises the framework baseline to Node 22.22+, React 19.2.7+, Vite 7+, ESM-only packages, and removes
react-router-domplus deprecated v8 future flags.What
splitRouteModules, and migrates route meta examples toloaderData.context.get(hydrogenContext.*)for RR8 route context access.dist/server/index.js.@shopify/remix-oxygenpublish ESM-only entrypoints where they depend on RR8.How to Test
pnpm --dir packages/hydrogen typecheckpnpm --dir packages/hydrogen-react typecheckpnpm --dir templates/skeleton run typecheckpnpm --dir packages/hydrogen exec vitest run src/react-router-preset.test.ts src/seo/seo.test.ts src/exports.test.tsSHOPIFY_UNIT_TEST=1 LANG=en-US.UTF-8 pnpm --dir packages/cli exec vitest run src/commands/hydrogen/build.test.ts --test-timeout=120000SHOPIFY_UNIT_TEST=1 LANG=en-US.UTF-8 pnpm --dir packages/cli exec vitest run src/commands/hydrogen/upgrade.test.ts -t "does not install react-router-dom" --test-timeout=60000SHOPIFY_UNIT_TEST=1 LANG=en-US.UTF-8 pnpm --dir packages/cli exec vitest run src/lib/setups/i18n/replacers.test.ts --test-timeout=60000pnpm --dir cookbook exec vitest run src/lib/apply.test.ts --test-timeout=120000pnpm --dir packages/hydrogen-react build && pnpm --dir packages/hydrogen build && pnpm --dir packages/remix-oxygen buildpnpm --dir packages/cli buildpnpm run buildfromtemplates/skeletonwith the local CLI patch applied