Skip to content

prerender: true, ssr: false does not work with basename #14587

@ysulyma

Description

@ysulyma

Reproduction

https://github.com/ysulyma/react-router-bug-basename

System Info

System:
    OS: macOS 14.6
    CPU: (8) arm64 Apple M3
    Memory: 3.09 GB / 24.00 GB
    Shell: 5.9 - /bin/zsh
  Binaries:
    Node: 23.11.1 - /Users/yuri/.nvm/versions/node/v23.11.1/bin/node
    Yarn: 1.22.22 - /Users/yuri/.nvm/versions/node/v23.11.1/bin/yarn
    npm: 10.9.2 - /Users/yuri/.nvm/versions/node/v23.11.1/bin/npm
    pnpm: 10.7.1 - /Users/yuri/.nvm/versions/node/v23.11.1/bin/pnpm
  Browsers:
    Chrome: 142.0.7444.176
    Firefox: 145.0
    Safari: 17.6
  npmPackages:
    @react-router/dev: ^7.9.2 => 7.9.6 
    @react-router/node: ^7.9.2 => 7.9.6 
    @react-router/serve: ^7.9.2 => 7.9.6 
    react-router: ^7.9.2 => 7.9.6 
    vite: ^7.1.7 => 7.2.4

Used Package Manager

npm

Expected Behavior

I expect to be able to upload the contents of build/client to public_html/test on my remote machine (= Apache static file server) and have it work.

Actual Behavior

If I specify base: "/test/" in vite.config.ts and basename: "/test/" in react-router.config.ts, npm run build produces the following build directory:

build
└── client
    ├── __spa-fallback.html
    ├── assets
    │   ├── chunk-4WY6JWTD-CgRXpLqU.js
    │   ├── entry.client-CMiCKmW-.js
    │   ├── home-Bl93Dt_P.js
    │   ├── logo-dark-pX2395Y0.svg
    │   ├── logo-light-CVbx2LBR.svg
    │   ├── manifest-813f43d4.js
    │   ├── root-BrAzMOzt.css
    │   └── root-HwIukUQl.js
    ├── favicon.ico
    └── test
        └── index.html

This is incorrect, there should be no test directory; index.html should be a child of client/.

If I specify base: "/test/" in vite.config.ts and basename: "/" in react-router.config.ts, npm run build produces the following build directory:

build
└── client
    ├── __spa-fallback.html
    ├── assets
    │   ├── chunk-4WY6JWTD-CgRXpLqU.js
    │   ├── entry.client-CMiCKmW-.js
    │   ├── home-Bl93Dt_P.js
    │   ├── logo-dark-pX2395Y0.svg
    │   ├── logo-light-CVbx2LBR.svg
    │   ├── manifest-813f43d4.js
    │   ├── root-BrAzMOzt.css
    │   └── root-HwIukUQl.js
    ├── favicon.ico
    └── index.html

This is the correct directory structure, but the app does not work. If I run vite preview and navigate to http://localhost:4173/test/, the page briefly displays correctly then switches to a 404 error, with the console error No routes matched location "/test/".

Metadata

Metadata

Assignees

No one assigned

    Labels

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions