@tanstack/react-router 1.31.26 → 1.31.27
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
|
@@ -23,31 +23,24 @@ function isModuleNotFoundError(error) {
|
|
|
23
23
|
}
|
|
24
24
|
function lazyRouteComponent(importer, exportName) {
|
|
25
25
|
let loadPromise;
|
|
26
|
+
let comp;
|
|
27
|
+
let error;
|
|
26
28
|
const load = () => {
|
|
27
29
|
if (!loadPromise) {
|
|
28
|
-
loadPromise = importer().
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
}
|
|
33
|
-
throw error;
|
|
30
|
+
loadPromise = importer().then((res) => {
|
|
31
|
+
comp = res[exportName ?? "default"];
|
|
32
|
+
}).catch((err) => {
|
|
33
|
+
error = err;
|
|
34
34
|
});
|
|
35
35
|
}
|
|
36
36
|
return loadPromise;
|
|
37
37
|
};
|
|
38
|
-
const lazyComp =
|
|
39
|
-
|
|
40
|
-
|
|
41
|
-
|
|
42
|
-
|
|
43
|
-
|
|
44
|
-
const moduleExports = await promise;
|
|
45
|
-
const comp = moduleExports[exportName ?? "default"];
|
|
46
|
-
return {
|
|
47
|
-
default: comp
|
|
48
|
-
};
|
|
49
|
-
} catch (error) {
|
|
50
|
-
if (error instanceof Error && isModuleNotFoundError(error) && typeof window !== "undefined" && typeof sessionStorage !== "undefined") {
|
|
38
|
+
const lazyComp = function Lazy(props) {
|
|
39
|
+
if (!loadPromise) {
|
|
40
|
+
load();
|
|
41
|
+
}
|
|
42
|
+
if (isModuleNotFoundError(error)) {
|
|
43
|
+
if (error instanceof Error && typeof window !== "undefined" && typeof sessionStorage !== "undefined") {
|
|
51
44
|
const storageKey = `tanstack_router_reload:${error.message}`;
|
|
52
45
|
if (!sessionStorage.getItem(storageKey)) {
|
|
53
46
|
sessionStorage.setItem(storageKey, "1");
|
|
@@ -59,7 +52,11 @@ function lazyRouteComponent(importer, exportName) {
|
|
|
59
52
|
}
|
|
60
53
|
throw error;
|
|
61
54
|
}
|
|
62
|
-
|
|
55
|
+
if (!comp) {
|
|
56
|
+
throw loadPromise;
|
|
57
|
+
}
|
|
58
|
+
return React__namespace.createElement(comp, props);
|
|
59
|
+
};
|
|
63
60
|
lazyComp.preload = load;
|
|
64
61
|
return lazyComp;
|
|
65
62
|
}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"lazyRouteComponent.cjs","sources":["../../src/lazyRouteComponent.tsx"],"sourcesContent":["import * as React from 'react'\nimport type { AsyncRouteComponent } from './route'\n\n// If the load fails due to module not found, it may mean a new version of\n// the build was deployed and the user's browser is still using an old version.\n// If this happens, the old version in the user's browser would have an outdated\n// URL to the lazy module.\n// In that case, we want to attempt one window refresh to get the latest.\nfunction isModuleNotFoundError(error: any): boolean {\n return (\n typeof error?.message === 'string' &&\n /Failed to fetch dynamically imported module/.test(error.message)\n )\n}\n\nexport function lazyRouteComponent<\n T extends Record<string, any>,\n TKey extends keyof T = 'default',\n>(\n importer: () => Promise<T>,\n exportName?: TKey,\n): T[TKey] extends (props: infer TProps) => any\n ? AsyncRouteComponent<TProps>\n : never {\n let loadPromise: Promise<any>
|
|
1
|
+
{"version":3,"file":"lazyRouteComponent.cjs","sources":["../../src/lazyRouteComponent.tsx"],"sourcesContent":["import * as React from 'react'\nimport { ControlledPromise, createControlledPromise } from './utils'\nimport type { AsyncRouteComponent } from './route'\n\n// If the load fails due to module not found, it may mean a new version of\n// the build was deployed and the user's browser is still using an old version.\n// If this happens, the old version in the user's browser would have an outdated\n// URL to the lazy module.\n// In that case, we want to attempt one window refresh to get the latest.\nfunction isModuleNotFoundError(error: any): boolean {\n return (\n typeof error?.message === 'string' &&\n /Failed to fetch dynamically imported module/.test(error.message)\n )\n}\n\nexport function lazyRouteComponent<\n T extends Record<string, any>,\n TKey extends keyof T = 'default',\n>(\n importer: () => Promise<T>,\n exportName?: TKey,\n): T[TKey] extends (props: infer TProps) => any\n ? AsyncRouteComponent<TProps>\n : never {\n let loadPromise: Promise<any> | undefined\n let comp: T[TKey] | T['default']\n let error: any\n\n const load = () => {\n if (!loadPromise) {\n loadPromise = importer()\n .then((res) => {\n comp = res[exportName ?? 'default']\n })\n .catch((err) => {\n error = err\n })\n }\n\n return loadPromise\n }\n\n const lazyComp = function Lazy(props: any) {\n if (!loadPromise) {\n load()\n }\n\n // Now that we're out of preload and into actual render path,\n // throw the error if it was a module not found error during preload\n if (isModuleNotFoundError(error)) {\n // We don't want an error thrown from preload in this case, because\n // there's nothing we want to do about module not found during preload.\n // Record the error, recover the promise with a null return,\n // and we will attempt module not found resolution during the render path.\n\n if (\n error instanceof Error &&\n typeof window !== 'undefined' &&\n typeof sessionStorage !== 'undefined'\n ) {\n // Again, we want to reload one time on module not found error and not enter\n // a reload loop if there is some other issue besides an old deploy.\n // That's why we store our reload attempt in sessionStorage.\n // Use error.message as key because it contains the module path that failed.\n const storageKey = `tanstack_router_reload:${error.message}`\n if (!sessionStorage.getItem(storageKey)) {\n sessionStorage.setItem(storageKey, '1')\n window.location.reload()\n\n // Return empty component while we wait for window to reload\n return {\n default: () => null,\n }\n }\n }\n\n // Otherwise, just throw the error\n throw error\n }\n\n if (!comp) {\n throw loadPromise\n }\n\n return React.createElement(comp, props)\n }\n\n ;(lazyComp as any).preload = load\n\n return lazyComp as any\n}\n"],"names":["React"],"mappings":";;;;;;;;;;;;;;;;;;;;AASA,SAAS,sBAAsB,OAAqB;AAClD,SACE,QAAO,+BAAO,aAAY,YAC1B,8CAA8C,KAAK,MAAM,OAAO;AAEpE;AAEgB,SAAA,mBAId,UACA,YAGQ;AACJ,MAAA;AACA,MAAA;AACA,MAAA;AAEJ,QAAM,OAAO,MAAM;AACjB,QAAI,CAAC,aAAa;AAChB,oBAAc,SAAS,EACpB,KAAK,CAAC,QAAQ;AACN,eAAA,IAAI,cAAc,SAAS;AAAA,MAAA,CACnC,EACA,MAAM,CAAC,QAAQ;AACN,gBAAA;AAAA,MAAA,CACT;AAAA,IACL;AAEO,WAAA;AAAA,EAAA;AAGH,QAAA,WAAW,SAAS,KAAK,OAAY;AACzC,QAAI,CAAC,aAAa;AACX;IACP;AAII,QAAA,sBAAsB,KAAK,GAAG;AAMhC,UACE,iBAAiB,SACjB,OAAO,WAAW,eAClB,OAAO,mBAAmB,aAC1B;AAKM,cAAA,aAAa,0BAA0B,MAAM,OAAO;AAC1D,YAAI,CAAC,eAAe,QAAQ,UAAU,GAAG;AACxB,yBAAA,QAAQ,YAAY,GAAG;AACtC,iBAAO,SAAS;AAGT,iBAAA;AAAA,YACL,SAAS,MAAM;AAAA,UAAA;AAAA,QAEnB;AAAA,MACF;AAGM,YAAA;AAAA,IACR;AAEA,QAAI,CAAC,MAAM;AACH,YAAA;AAAA,IACR;AAEO,WAAAA,iBAAM,cAAc,MAAM,KAAK;AAAA,EAAA;AAGtC,WAAiB,UAAU;AAEtB,SAAA;AACT;;"}
|
|
@@ -4,31 +4,24 @@ function isModuleNotFoundError(error) {
|
|
|
4
4
|
}
|
|
5
5
|
function lazyRouteComponent(importer, exportName) {
|
|
6
6
|
let loadPromise;
|
|
7
|
+
let comp;
|
|
8
|
+
let error;
|
|
7
9
|
const load = () => {
|
|
8
10
|
if (!loadPromise) {
|
|
9
|
-
loadPromise = importer().
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
}
|
|
14
|
-
throw error;
|
|
11
|
+
loadPromise = importer().then((res) => {
|
|
12
|
+
comp = res[exportName ?? "default"];
|
|
13
|
+
}).catch((err) => {
|
|
14
|
+
error = err;
|
|
15
15
|
});
|
|
16
16
|
}
|
|
17
17
|
return loadPromise;
|
|
18
18
|
};
|
|
19
|
-
const lazyComp =
|
|
20
|
-
|
|
21
|
-
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
const moduleExports = await promise;
|
|
26
|
-
const comp = moduleExports[exportName ?? "default"];
|
|
27
|
-
return {
|
|
28
|
-
default: comp
|
|
29
|
-
};
|
|
30
|
-
} catch (error) {
|
|
31
|
-
if (error instanceof Error && isModuleNotFoundError(error) && typeof window !== "undefined" && typeof sessionStorage !== "undefined") {
|
|
19
|
+
const lazyComp = function Lazy(props) {
|
|
20
|
+
if (!loadPromise) {
|
|
21
|
+
load();
|
|
22
|
+
}
|
|
23
|
+
if (isModuleNotFoundError(error)) {
|
|
24
|
+
if (error instanceof Error && typeof window !== "undefined" && typeof sessionStorage !== "undefined") {
|
|
32
25
|
const storageKey = `tanstack_router_reload:${error.message}`;
|
|
33
26
|
if (!sessionStorage.getItem(storageKey)) {
|
|
34
27
|
sessionStorage.setItem(storageKey, "1");
|
|
@@ -40,7 +33,11 @@ function lazyRouteComponent(importer, exportName) {
|
|
|
40
33
|
}
|
|
41
34
|
throw error;
|
|
42
35
|
}
|
|
43
|
-
|
|
36
|
+
if (!comp) {
|
|
37
|
+
throw loadPromise;
|
|
38
|
+
}
|
|
39
|
+
return React.createElement(comp, props);
|
|
40
|
+
};
|
|
44
41
|
lazyComp.preload = load;
|
|
45
42
|
return lazyComp;
|
|
46
43
|
}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"lazyRouteComponent.js","sources":["../../src/lazyRouteComponent.tsx"],"sourcesContent":["import * as React from 'react'\nimport type { AsyncRouteComponent } from './route'\n\n// If the load fails due to module not found, it may mean a new version of\n// the build was deployed and the user's browser is still using an old version.\n// If this happens, the old version in the user's browser would have an outdated\n// URL to the lazy module.\n// In that case, we want to attempt one window refresh to get the latest.\nfunction isModuleNotFoundError(error: any): boolean {\n return (\n typeof error?.message === 'string' &&\n /Failed to fetch dynamically imported module/.test(error.message)\n )\n}\n\nexport function lazyRouteComponent<\n T extends Record<string, any>,\n TKey extends keyof T = 'default',\n>(\n importer: () => Promise<T>,\n exportName?: TKey,\n): T[TKey] extends (props: infer TProps) => any\n ? AsyncRouteComponent<TProps>\n : never {\n let loadPromise: Promise<any>
|
|
1
|
+
{"version":3,"file":"lazyRouteComponent.js","sources":["../../src/lazyRouteComponent.tsx"],"sourcesContent":["import * as React from 'react'\nimport { ControlledPromise, createControlledPromise } from './utils'\nimport type { AsyncRouteComponent } from './route'\n\n// If the load fails due to module not found, it may mean a new version of\n// the build was deployed and the user's browser is still using an old version.\n// If this happens, the old version in the user's browser would have an outdated\n// URL to the lazy module.\n// In that case, we want to attempt one window refresh to get the latest.\nfunction isModuleNotFoundError(error: any): boolean {\n return (\n typeof error?.message === 'string' &&\n /Failed to fetch dynamically imported module/.test(error.message)\n )\n}\n\nexport function lazyRouteComponent<\n T extends Record<string, any>,\n TKey extends keyof T = 'default',\n>(\n importer: () => Promise<T>,\n exportName?: TKey,\n): T[TKey] extends (props: infer TProps) => any\n ? AsyncRouteComponent<TProps>\n : never {\n let loadPromise: Promise<any> | undefined\n let comp: T[TKey] | T['default']\n let error: any\n\n const load = () => {\n if (!loadPromise) {\n loadPromise = importer()\n .then((res) => {\n comp = res[exportName ?? 'default']\n })\n .catch((err) => {\n error = err\n })\n }\n\n return loadPromise\n }\n\n const lazyComp = function Lazy(props: any) {\n if (!loadPromise) {\n load()\n }\n\n // Now that we're out of preload and into actual render path,\n // throw the error if it was a module not found error during preload\n if (isModuleNotFoundError(error)) {\n // We don't want an error thrown from preload in this case, because\n // there's nothing we want to do about module not found during preload.\n // Record the error, recover the promise with a null return,\n // and we will attempt module not found resolution during the render path.\n\n if (\n error instanceof Error &&\n typeof window !== 'undefined' &&\n typeof sessionStorage !== 'undefined'\n ) {\n // Again, we want to reload one time on module not found error and not enter\n // a reload loop if there is some other issue besides an old deploy.\n // That's why we store our reload attempt in sessionStorage.\n // Use error.message as key because it contains the module path that failed.\n const storageKey = `tanstack_router_reload:${error.message}`\n if (!sessionStorage.getItem(storageKey)) {\n sessionStorage.setItem(storageKey, '1')\n window.location.reload()\n\n // Return empty component while we wait for window to reload\n return {\n default: () => null,\n }\n }\n }\n\n // Otherwise, just throw the error\n throw error\n }\n\n if (!comp) {\n throw loadPromise\n }\n\n return React.createElement(comp, props)\n }\n\n ;(lazyComp as any).preload = load\n\n return lazyComp as any\n}\n"],"names":[],"mappings":";AASA,SAAS,sBAAsB,OAAqB;AAClD,SACE,QAAO,+BAAO,aAAY,YAC1B,8CAA8C,KAAK,MAAM,OAAO;AAEpE;AAEgB,SAAA,mBAId,UACA,YAGQ;AACJ,MAAA;AACA,MAAA;AACA,MAAA;AAEJ,QAAM,OAAO,MAAM;AACjB,QAAI,CAAC,aAAa;AAChB,oBAAc,SAAS,EACpB,KAAK,CAAC,QAAQ;AACN,eAAA,IAAI,cAAc,SAAS;AAAA,MAAA,CACnC,EACA,MAAM,CAAC,QAAQ;AACN,gBAAA;AAAA,MAAA,CACT;AAAA,IACL;AAEO,WAAA;AAAA,EAAA;AAGH,QAAA,WAAW,SAAS,KAAK,OAAY;AACzC,QAAI,CAAC,aAAa;AACX;IACP;AAII,QAAA,sBAAsB,KAAK,GAAG;AAMhC,UACE,iBAAiB,SACjB,OAAO,WAAW,eAClB,OAAO,mBAAmB,aAC1B;AAKM,cAAA,aAAa,0BAA0B,MAAM,OAAO;AAC1D,YAAI,CAAC,eAAe,QAAQ,UAAU,GAAG;AACxB,yBAAA,QAAQ,YAAY,GAAG;AACtC,iBAAO,SAAS;AAGT,iBAAA;AAAA,YACL,SAAS,MAAM;AAAA,UAAA;AAAA,QAEnB;AAAA,MACF;AAGM,YAAA;AAAA,IACR;AAEA,QAAI,CAAC,MAAM;AACH,YAAA;AAAA,IACR;AAEO,WAAA,MAAM,cAAc,MAAM,KAAK;AAAA,EAAA;AAGtC,WAAiB,UAAU;AAEtB,SAAA;AACT;"}
|
package/package.json
CHANGED
|
@@ -1,4 +1,5 @@
|
|
|
1
1
|
import * as React from 'react'
|
|
2
|
+
import { ControlledPromise, createControlledPromise } from './utils'
|
|
2
3
|
import type { AsyncRouteComponent } from './route'
|
|
3
4
|
|
|
4
5
|
// If the load fails due to module not found, it may mean a new version of
|
|
@@ -22,50 +23,39 @@ export function lazyRouteComponent<
|
|
|
22
23
|
): T[TKey] extends (props: infer TProps) => any
|
|
23
24
|
? AsyncRouteComponent<TProps>
|
|
24
25
|
: never {
|
|
25
|
-
let loadPromise: Promise<any>
|
|
26
|
-
|
|
27
|
-
|
|
26
|
+
let loadPromise: Promise<any> | undefined
|
|
27
|
+
let comp: T[TKey] | T['default']
|
|
28
|
+
let error: any
|
|
28
29
|
|
|
29
30
|
const load = () => {
|
|
30
|
-
// eslint-disable-next-line @typescript-eslint/no-unnecessary-condition
|
|
31
31
|
if (!loadPromise) {
|
|
32
|
-
loadPromise = importer()
|
|
33
|
-
|
|
34
|
-
|
|
35
|
-
|
|
36
|
-
|
|
37
|
-
|
|
38
|
-
|
|
39
|
-
loadPromise.moduleNotFoundError = error
|
|
40
|
-
|
|
41
|
-
return null
|
|
42
|
-
}
|
|
43
|
-
throw error
|
|
44
|
-
})
|
|
32
|
+
loadPromise = importer()
|
|
33
|
+
.then((res) => {
|
|
34
|
+
comp = res[exportName ?? 'default']
|
|
35
|
+
})
|
|
36
|
+
.catch((err) => {
|
|
37
|
+
error = err
|
|
38
|
+
})
|
|
45
39
|
}
|
|
46
40
|
|
|
47
41
|
return loadPromise
|
|
48
42
|
}
|
|
49
43
|
|
|
50
|
-
const lazyComp =
|
|
51
|
-
|
|
52
|
-
|
|
44
|
+
const lazyComp = function Lazy(props: any) {
|
|
45
|
+
if (!loadPromise) {
|
|
46
|
+
load()
|
|
47
|
+
}
|
|
53
48
|
|
|
54
|
-
|
|
55
|
-
|
|
56
|
-
|
|
57
|
-
|
|
58
|
-
|
|
59
|
-
|
|
49
|
+
// Now that we're out of preload and into actual render path,
|
|
50
|
+
// throw the error if it was a module not found error during preload
|
|
51
|
+
if (isModuleNotFoundError(error)) {
|
|
52
|
+
// We don't want an error thrown from preload in this case, because
|
|
53
|
+
// there's nothing we want to do about module not found during preload.
|
|
54
|
+
// Record the error, recover the promise with a null return,
|
|
55
|
+
// and we will attempt module not found resolution during the render path.
|
|
60
56
|
|
|
61
|
-
const comp = moduleExports[exportName ?? 'default']
|
|
62
|
-
return {
|
|
63
|
-
default: comp,
|
|
64
|
-
}
|
|
65
|
-
} catch (error) {
|
|
66
57
|
if (
|
|
67
58
|
error instanceof Error &&
|
|
68
|
-
isModuleNotFoundError(error) &&
|
|
69
59
|
typeof window !== 'undefined' &&
|
|
70
60
|
typeof sessionStorage !== 'undefined'
|
|
71
61
|
) {
|
|
@@ -84,9 +74,17 @@ export function lazyRouteComponent<
|
|
|
84
74
|
}
|
|
85
75
|
}
|
|
86
76
|
}
|
|
77
|
+
|
|
78
|
+
// Otherwise, just throw the error
|
|
87
79
|
throw error
|
|
88
80
|
}
|
|
89
|
-
|
|
81
|
+
|
|
82
|
+
if (!comp) {
|
|
83
|
+
throw loadPromise
|
|
84
|
+
}
|
|
85
|
+
|
|
86
|
+
return React.createElement(comp, props)
|
|
87
|
+
}
|
|
90
88
|
|
|
91
89
|
;(lazyComp as any).preload = load
|
|
92
90
|
|