adopt Vite builds

[punkpeye]

For context, the current build (using tsup) bundles code and produces hashed output, e.g.,

dist
├── development
│   ├── chunk-D4RADZKF.mjs
│   ├── dom-export.d.mts
│   ├── dom-export.d.ts
│   ├── dom-export.js
│   ├── dom-export.mjs
│   ├── index.d.mts
│   ├── index.d.ts
│   ├── index.js
│   ├── index.mjs
│   ├── lib
│   │   └── types
│   │       ├── route-module.d.mts
│   │       ├── route-module.d.ts
│   │       ├── route-module.js
│   │       └── route-module.mjs
│   ├── lib-CCSAGgcP.d.mts
│   ├── route-data-B9_30zbP.d.ts
│   └── route-data-C6QaL0wu.d.mts
└── production
    ├── chunk-CVXGOGHQ.mjs
    ├── dom-export.d.mts
    ├── dom-export.d.ts
    ├── dom-export.js
    ├── dom-export.mjs
    ├── index.d.mts
    ├── index.d.ts
    ├── index.js
    ├── index.mjs
    ├── lib
    │   └── types
    │       ├── route-module.d.mts
    │       ├── route-module.d.ts
    │       ├── route-module.js
    │       └── route-module.mjs
    ├── lib-CCSAGgcP.d.mts
    ├── route-data-B9_30zbP.d.ts
    └── route-data-C6QaL0wu.d.mts

7 directories, 32 files

This makes it hard to trace origin of errors and patch react-router.

In contrast, Vite approach produces unbundled/stable outputs.

Example:

dist
├── development
│   ├── dom-export.d.ts
│   ├── dom-export.js
│   ├── dom-export.mjs
│   ├── index.d.ts
│   ├── index.js
│   ├── index.mjs
│   ├── lib
│   │   ├── components.js
│   │   ├── components.mjs
│   │   ├── context.js
│   │   ├── context.mjs
│   │   ├── dom
│   │   │   ├── dom.js
│   │   │   ├── dom.mjs
│   │   │   ├── lib.js
...
    │   │   ├── single-fetch.mjs
    │   │   ├── warnings.js
    │   │   └── warnings.mjs
    │   └── types
    │       ├── route-module.d.ts
    │       ├── route-module.js
    │       └── route-module.mjs
    ├── route-module.d.ts
    └── vendor
        └── turbo-stream-v2
            ├── flatten.js
            ├── flatten.mjs
            ├── turbo-stream.js
            ├── turbo-stream.mjs
            ├── unflatten.js
            ├── unflatten.mjs
            ├── utils.js
            └── utils.mjs

23 directories, 220 files

The benefit of this approach is that it enables easier to follow stack traces and allows to patch react-router as needed.

[changeset-bot]

⚠️ No Changeset found

Latest commit: a6f8633

Merging this PR will not cause a version bump for any packages. If these changes should not result in a new version, you're good to go. If these changes should result in a version bump, you need to add a changeset.

This PR includes no changesets

When changesets are added to this PR, you'll see the packages that this PR includes changesets for and the associated semver types

Click here to learn what changesets are, and how to add one.

Click here if you're a maintainer who wants to add a changeset to this PR

[remix-cla-bot]

Hi @punkpeye,

Welcome, and thank you for contributing to React Router!

Before we consider your pull request, we ask that you sign our Contributor License Agreement (CLA). We require this only once.

You may review the CLA and sign it by adding your name to contributors.yml.

Once the CLA is signed, the CLA Signed label will be added to the pull request.

If you have already signed the CLA and received this response in error, or if you have any questions, please contact us at hello@remix.run.

Thanks!

- The Remix team

[remix-cla-bot]

Thank you for signing the Contributor License Agreement. Let's get this merged! 🥳

[AlemTuzlak]

FWIW I think tsup provides a "chunk" config option which allows you to get the same result as you're trying to achieve, I might be wrong but thats what I used in react-router-devtools

[punkpeye]

FWIW I think tsup provides a "chunk" config option which allows you to get the same result as you're trying to achieve, I might be wrong but thats what I used in react-router-devtools

I could not figure out a way to do it based on their documentation and/or community resources (GitHub issues, etc).

Meanwhile, Vite configuration is pretty straightforward.

I would also argue that it benefits React Router to adopt Vite simply because the project is a lot more popular than tsup (24.9m vs 1.5m downloads).

Finally, this project already uses Vite in many other parts of the mono-repo. Moving to Vite builds provides a nice way to reduce the number of different tools that the project depends on.

[gustavopch]

I have the same pain of breaking patches every time I upgrade React Router and wrote about it here: #13076

[brophdawg11]

A change of this magnitude will need to go through a github proposal discussion so we can get the right folks involved, and decide if we want to move away from tsup and what we want to move to. We would be open to accepting a PR with a small change to the current tsup configs to avoid the hashed names.

[punkpeye]

For anyone discovering this PR, please chip in to the discussion here #13076