Skip to content

Commit 96e1fc1

Browse files
authored
Inline startTransitionImpl to avoid .d.ts issues with skipLibCheck:false (#10622)
* Inline startTransitionImpl to avoid .d.ts causing issues with skipLibCheck:false * Add changeset
1 parent 73cd01e commit 96e1fc1

File tree

5 files changed

+54
-32
lines changed

5 files changed

+54
-32
lines changed
Lines changed: 6 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,6 @@
1+
---
2+
"react-router": patch
3+
"react-router-dom": patch
4+
---
5+
6+
Fix `tsc --skipLibCheck:false` issues on React 17

packages/react-router-dom/index.tsx

Lines changed: 24 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -27,7 +27,6 @@ import {
2727
UNSAFE_NavigationContext as NavigationContext,
2828
UNSAFE_RouteContext as RouteContext,
2929
UNSAFE_mapRouteProperties as mapRouteProperties,
30-
UNSAFE_startTransitionImpl as startTransitionImpl,
3130
UNSAFE_useRouteId as useRouteId,
3231
} from "react-router";
3332
import type {
@@ -297,6 +296,30 @@ function deserializeErrors(
297296
//#region Components
298297
////////////////////////////////////////////////////////////////////////////////
299298

299+
/**
300+
Webpack + React 17 fails to compile on any of the following because webpack
301+
complains that `startTransition` doesn't exist in `React`:
302+
* import { startTransition } from "react"
303+
* import * as React from from "react";
304+
"startTransition" in React ? React.startTransition(() => setState()) : setState()
305+
* import * as React from from "react";
306+
"startTransition" in React ? React["startTransition"](() => setState()) : setState()
307+
308+
Moving it to a constant such as the following solves the Webpack/React 17 issue:
309+
* import * as React from from "react";
310+
const START_TRANSITION = "startTransition";
311+
START_TRANSITION in React ? React[START_TRANSITION](() => setState()) : setState()
312+
313+
However, that introduces webpack/terser minification issues in production builds
314+
in React 18 where minification/obfuscation ends up removing the call of
315+
React.startTransition entirely from the first half of the ternary. Grabbing
316+
this exported reference once up front resolves that issue.
317+
318+
See https://github.com/remix-run/react-router/issues/10579
319+
*/
320+
const START_TRANSITION = "startTransition";
321+
const startTransitionImpl = React[START_TRANSITION];
322+
300323
export interface BrowserRouterProps {
301324
basename?: string;
302325
children?: React.ReactNode;

packages/react-router/index.ts

Lines changed: 0 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -43,7 +43,6 @@ import {
4343
UNSAFE_warning as warning,
4444
} from "@remix-run/router";
4545

46-
import startTransitionImpl from "./lib/polyfills/start-transition";
4746
import type {
4847
AwaitProps,
4948
MemoryRouterProps,
@@ -304,5 +303,4 @@ export {
304303
mapRouteProperties as UNSAFE_mapRouteProperties,
305304
useRouteId as UNSAFE_useRouteId,
306305
useRoutesImpl as UNSAFE_useRoutesImpl,
307-
startTransitionImpl as UNSAFE_startTransitionImpl,
308306
};

packages/react-router/lib/components.tsx

Lines changed: 24 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -22,7 +22,6 @@ import {
2222
UNSAFE_getPathContributingMatches as getPathContributingMatches,
2323
} from "@remix-run/router";
2424

25-
import startTransitionImpl from "./polyfills/start-transition";
2625
import type {
2726
DataRouteObject,
2827
IndexRouteObject,
@@ -60,6 +59,30 @@ export interface RouterProviderProps {
6059
future?: FutureConfig;
6160
}
6261

62+
/**
63+
Webpack + React 17 fails to compile on any of the following because webpack
64+
complains that `startTransition` doesn't exist in `React`:
65+
* import { startTransition } from "react"
66+
* import * as React from from "react";
67+
"startTransition" in React ? React.startTransition(() => setState()) : setState()
68+
* import * as React from from "react";
69+
"startTransition" in React ? React["startTransition"](() => setState()) : setState()
70+
71+
Moving it to a constant such as the following solves the Webpack/React 17 issue:
72+
* import * as React from from "react";
73+
const START_TRANSITION = "startTransition";
74+
START_TRANSITION in React ? React[START_TRANSITION](() => setState()) : setState()
75+
76+
However, that introduces webpack/terser minification issues in production builds
77+
in React 18 where minification/obfuscation ends up removing the call of
78+
React.startTransition entirely from the first half of the ternary. Grabbing
79+
this exported reference once up front resolves that issue.
80+
81+
See https://github.com/remix-run/react-router/issues/10579
82+
*/
83+
const START_TRANSITION = "startTransition";
84+
const startTransitionImpl = React[START_TRANSITION];
85+
6386
/**
6487
* Given a Remix Router instance, render the appropriate UI
6588
*/

packages/react-router/lib/polyfills/start-transition.ts

Lines changed: 0 additions & 28 deletions
This file was deleted.

0 commit comments

Comments
 (0)