react-router - npm Package Versions

v7.0.1

Date: 2024-11-22

Patch Changes

• Ensure typegen file watcher is cleaned up when Vite dev server restarts (#12331)
• Pass route error to ErrorBoundary as a prop (#12338)

Changes by Package

• react-router
• @react-router/architect
• @react-router/cloudflare
• @react-router/dev
• @react-router/express
• @react-router/fs-routes
• @react-router/node
• @react-router/remix-config-routes-adapter
• @react-router/serve

Full Changelog: v7.0.0...v7.0.1

v7.0.0

Date: 2024-11-21

Breaking Changes

Package Restructuring

• The react-router-dom, @remix-run/react, @remix-run/server-runtime, and @remix-run/router have been collapsed into the react-router package
  • To ease migration, react-router-dom is still published in v7 as a re-export of everything from react-router
• The @remix-run/cloudflare-pages and @remix-run/cloudflare-workers have been collapsed into @react-router/cloudflare package`
• The react-router-dom-v5-compat and react-router-native packages are removed starting with v7

Removed Adapter Re-exports

Remix v2 used to re-export all common @remix-run/server-runtime APIs through the various runtime packages (node, cloudflare, deno) so that you wouldn't need an additional @remix-run/server-runtime dependency in your package.json. With the collapsing of packages into react-router, these common APIs are now no longer re-exported through the runtime adapters. You should import all common APIs from react-router, and only import runtime-specific APIs from the runtime packages:

// Runtime-specific APIs
import { createFileSessionStorage } from "@react-router/node";
// Runtime-agnostic APIs
import { redirect, useLoaderData } from "react-router";

Removed APIs

The following APIs have been removed in React Router v7:

• json
• defer
• unstable_composeUploadHandlers
• unstable_createMemoryUploadHandler
• unstable_parseMultipartFormData

Minimum Versions

React Router v7 requires the following minimum versions:

• node@20
  • React Router no longer provides an installGlobals method to polyfill the fetch API
• react@18, react-dom@18

Adopted Future Flag Behaviors

Remix and React Router follow an API Development Strategy leveraging "Future Flags" to avoid introducing a slew of breaking changes in a major release. Instead, breaking changes are introduce din minor releases behind a flag, allowing users to opt-in at their convenience. In the next major release, all future flag behaviors become the default behavior.

The following previously flagged behaviors are now the default in React Router v7:

• React Router v6 flags
  • future.v7_relativeSplatPath
  • future.v7_startTransition
  • future.v7_fetcherPersist
  • future.v7_normalizeFormMethod
  • future.v7_partialHydration
  • future.v7_skipActionStatusRevalidation
• Remix v2 flags
  • future.v3_fetcherPersist
  • future.v3_relativeSplatPath
  • future.v3_throwAbortReason
  • future.v3_singleFetch
  • future.v3_lazyRouteDiscovery
  • future.v3_optimizeDeps

Vite Compiler

The Remix Vite plugin is the proper way to build full-stack SSR apps using React Router v7. The former esbuild-based compiler is no longer available.

Renamed vitePlugin and cloudflareDevProxyVitePlugin

For Remix consumers migrating to React Router, the vitePlugin and cloudflareDevProxyVitePlugin exports have been renamed and moved (#11904)

-import {
-  vitePlugin as remix,
-  cloudflareDevProxyVitePlugin,
-} from "@remix/dev";

+import { reactRouter } from "@react-router/dev/vite";
+import { cloudflareDevProxy } from "@react-router/dev/vite/cloudflare";

Removed manifest option

For Remix consumers migrating to React Router, the Vite plugin's manifest option has been removed. The manifest option been superseded by the more powerful buildEnd hook since it's passed the buildManifest argument. You can still write the build manifest to disk if needed, but you'll most likely find it more convenient to write any logic depending on the build manifest within the buildEnd hook itself. (#11573)

If you were using the manifest option, you can replace it with a buildEnd hook that writes the manifest to disk like this:

// react-router.config.ts
import { type Config } from "@react-router/dev/config";
import { writeFile } from "node:fs/promises";

export default {
  async buildEnd({ buildManifest }) {
    await writeFile(
      "build/manifest.json",
      JSON.stringify(buildManifest, null, 2),
      "utf-8"
    );
  },
} satisfies Config;

Exposed Router Promises

Because React 19 will have first-class support for handling promises in the render pass (via React.use and useAction), we are now comfortable exposing the promises for the APIs that previously returned undefined:

• useNavigate()
• useSubmit()
• useFetcher().load
• useFetcher().submit
• useRevalidator().revalidate()

Other Notable Changes