feat(react-router): don't bundle react-router in react-router/dom export

.changeset/breezy-pets-hug.md

@@ -0,0 +1,5 @@
+---
+"react-router": patch
+---
+
+Don't bundle `react-router` in `react-router/dom` CJS export

packages/react-router/__tests__/dom/dom-export-test.tsx

@@ -0,0 +1,40 @@
+import * as React from "react";
+
+import { render, screen } from "@testing-library/react";
+import { createMemoryRouter, useParams } from "react-router";
+import { RouterProvider } from "react-router/dom";
+
+describe("react-router/dom", () => {
+ function ShowParams() {
+ return <pre data-testid="params">{JSON.stringify(useParams())}</pre>;
+ }
+
+ describe("Does not bundle react-router causing duplicate context issues", () => {
+ it("with route provider shows the url params", async () => {
+ const router = createMemoryRouter(
+ [
+ {
+ path: "/blog/:slug",
+ element: <ShowParams />,
+ },
+ ],
+ {
+ initialEntries: ["/blog/react-router"],
+ }
+ );
+
+ // When react-router was bundled in CJS scenarios, this `react-router/dom`
+ // version of `RouterProvider` caused duplicate contexts and we would not
+ // find the param values
+ render(<RouterProvider router={router} />);
+
+ expect(await screen.findByTestId("params")).toMatchInlineSnapshot(`
+ <pre
+ data-testid="params"
+ >
+ {"slug":"react-router"}
+ </pre>
+ `);
+ });
+ });
+});

packages/react-router/tsup.config.ts

@@ -13,6 +13,8 @@ const config = (enableDevWarnings: boolean) =>
  clean: false,
  entry,
  format: ["cjs"],
+ // Don't bundle `react-router` in sub-exports (i.e., `react-router/dom`)
+ external: ["react-router"],
  outDir: enableDevWarnings ? "dist/development" : "dist/production",
  dts: true,
  banner: {
@@ -28,6 +30,10 @@ const config = (enableDevWarnings: boolean) =>
  clean: false,
  entry,
  format: ["esm"],
+ // We don't do the external thing for `react-router` here because it
+ // doesn't get bundled by default in the ESM build, and when we tried it
+ // in https://github.com/remix-run/react-router/pull/13497 it changed up
+ // some chunk creation that we didn't want to risk having any side effects
  outDir: enableDevWarnings ? "dist/development" : "dist/production",
  dts: true,
  banner: {