Skip to content

RSC Framework Mode is broken with React 19.2.1 / @vitejs/plugin-rsc 0.5.x #14633

@r52j

Description

@r52j

Reproduction

Create a new project from the official RSC framework mode template using

npx create-react-router@latest --template remix-run/react-router-templates/unstable_rsc-framework-mode

or on StackBlitz: https://stackblitz.com/github/remix-run/react-router-templates/tree/main/unstable_rsc-framework-mode

and run npm run dev.

You may upgrade to React Router 7.10.0 from 7.9.2 as installed by default -- makes no difference.

System Info

System:
    OS: Linux 5.0 undefined
    CPU: (8) x64 Intel(R) Core(TM) i9-9880H CPU @ 2.30GHz
    Memory: 0 Bytes / 0 Bytes
    Shell: 1.0 - /bin/jsh
  Binaries:
    Node: 20.19.1 - /usr/local/bin/node
    Yarn: 1.22.19 - /usr/local/bin/yarn
    npm: 10.8.2 - /usr/local/bin/npm
    pnpm: 8.15.6 - /usr/local/bin/pnpm
  npmPackages:
    @react-router/dev: 7.10.0 => 7.10.0 
    @react-router/fs-routes: 7.10.0 => 7.10.0 
    @react-router/serve: 7.10.0 => 7.10.0 
    react-router: 7.10.0 => 7.10.0 
    vite: 7.1.6 => 7.1.6
    @vitejs/plugin-rsc: 0.5.4 => 0.5.4

Used Package Manager

npm

Expected Behavior

Dev server starts up and, when accessed, shows the demo app with the React Router logo.

Actual Behavior

Requests to the dev server hang indefinitely.

This specific behaviour seems to occur when trying to render a server component route inside a client component root. If I change the default export in root.tsx to a named ServerComponent export, the app won't hang up, but render an error message instead:

Error: You must render this element inside a <HydratedRouter> element

Metadata

Metadata

Assignees

No one assigned

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions