@tanstack/router-plugin 1.102.3 → 1.102.5

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.
Files changed (30) hide show
  1. package/dist/cjs/core/code-splitter/compilers.cjs +23 -16
  2. package/dist/cjs/core/code-splitter/compilers.cjs.map +1 -1
  3. package/dist/cjs/core/code-splitter/compilers.d.cts +2 -0
  4. package/dist/cjs/core/code-splitter/framework-options.cjs +38 -0
  5. package/dist/cjs/core/code-splitter/framework-options.cjs.map +1 -0
  6. package/dist/cjs/core/code-splitter/framework-options.d.cts +12 -0
  7. package/dist/cjs/core/config.d.cts +4 -4
  8. package/dist/cjs/core/router-code-splitter-plugin.cjs +2 -1
  9. package/dist/cjs/core/router-code-splitter-plugin.cjs.map +1 -1
  10. package/dist/cjs/esbuild.d.cts +3 -3
  11. package/dist/cjs/rspack.d.cts +3 -3
  12. package/dist/cjs/vite.d.cts +3 -3
  13. package/dist/cjs/webpack.d.cts +3 -3
  14. package/dist/esm/core/code-splitter/compilers.d.ts +2 -0
  15. package/dist/esm/core/code-splitter/compilers.js +23 -16
  16. package/dist/esm/core/code-splitter/compilers.js.map +1 -1
  17. package/dist/esm/core/code-splitter/framework-options.d.ts +12 -0
  18. package/dist/esm/core/code-splitter/framework-options.js +38 -0
  19. package/dist/esm/core/code-splitter/framework-options.js.map +1 -0
  20. package/dist/esm/core/config.d.ts +4 -4
  21. package/dist/esm/core/router-code-splitter-plugin.js +2 -1
  22. package/dist/esm/core/router-code-splitter-plugin.js.map +1 -1
  23. package/dist/esm/esbuild.d.ts +3 -3
  24. package/dist/esm/rspack.d.ts +3 -3
  25. package/dist/esm/vite.d.ts +3 -3
  26. package/dist/esm/webpack.d.ts +3 -3
  27. package/package.json +3 -3
  28. package/src/core/code-splitter/compilers.ts +29 -17
  29. package/src/core/code-splitter/framework-options.ts +47 -0
  30. package/src/core/router-code-splitter-plugin.ts +1 -0
@@ -9,7 +9,7 @@ import { configSchema, Config } from './core/config.js';
9
9
  * ```
10
10
  */
11
11
  declare const TanStackRouterGeneratorEsbuild: (options?: Partial<{
12
- target: "react";
12
+ target: "react" | "solid";
13
13
  routeFileIgnorePrefix: string;
14
14
  routesDirectory: string;
15
15
  generatedRouteTree: string;
@@ -50,7 +50,7 @@ declare const TanStackRouterGeneratorEsbuild: (options?: Partial<{
50
50
  * ```
51
51
  */
52
52
  declare const TanStackRouterCodeSplitterEsbuild: (options?: Partial<{
53
- target: "react";
53
+ target: "react" | "solid";
54
54
  routeFileIgnorePrefix: string;
55
55
  routesDirectory: string;
56
56
  generatedRouteTree: string;
@@ -91,7 +91,7 @@ declare const TanStackRouterCodeSplitterEsbuild: (options?: Partial<{
91
91
  * ```
92
92
  */
93
93
  declare const TanStackRouterEsbuild: (options?: Partial<{
94
- target: "react";
94
+ target: "react" | "solid";
95
95
  routeFileIgnorePrefix: string;
96
96
  routesDirectory: string;
97
97
  generatedRouteTree: string;
@@ -13,7 +13,7 @@ import { configSchema, Config } from './core/config.js';
13
13
  * ```
14
14
  */
15
15
  declare const TanStackRouterGeneratorRspack: (options?: Partial<{
16
- target: "react";
16
+ target: "react" | "solid";
17
17
  routeFileIgnorePrefix: string;
18
18
  routesDirectory: string;
19
19
  generatedRouteTree: string;
@@ -58,7 +58,7 @@ declare const TanStackRouterGeneratorRspack: (options?: Partial<{
58
58
  * ```
59
59
  */
60
60
  declare const TanStackRouterCodeSplitterRspack: (options?: Partial<{
61
- target: "react";
61
+ target: "react" | "solid";
62
62
  routeFileIgnorePrefix: string;
63
63
  routesDirectory: string;
64
64
  generatedRouteTree: string;
@@ -103,7 +103,7 @@ declare const TanStackRouterCodeSplitterRspack: (options?: Partial<{
103
103
  * ```
104
104
  */
105
105
  declare const TanStackRouterRspack: (options?: Partial<{
106
- target: "react";
106
+ target: "react" | "solid";
107
107
  routeFileIgnorePrefix: string;
108
108
  routesDirectory: string;
109
109
  generatedRouteTree: string;
@@ -9,7 +9,7 @@ import { configSchema, Config } from './core/config.js';
9
9
  * ```
10
10
  */
11
11
  declare const TanStackRouterGeneratorVite: (options?: Partial<{
12
- target: "react";
12
+ target: "react" | "solid";
13
13
  routeFileIgnorePrefix: string;
14
14
  routesDirectory: string;
15
15
  generatedRouteTree: string;
@@ -50,7 +50,7 @@ declare const TanStackRouterGeneratorVite: (options?: Partial<{
50
50
  * ```
51
51
  */
52
52
  declare const TanStackRouterCodeSplitterVite: (options?: Partial<{
53
- target: "react";
53
+ target: "react" | "solid";
54
54
  routeFileIgnorePrefix: string;
55
55
  routesDirectory: string;
56
56
  generatedRouteTree: string;
@@ -91,7 +91,7 @@ declare const TanStackRouterCodeSplitterVite: (options?: Partial<{
91
91
  * ```
92
92
  */
93
93
  declare const TanStackRouterVite: (options?: Partial<{
94
- target: "react";
94
+ target: "react" | "solid";
95
95
  routeFileIgnorePrefix: string;
96
96
  routesDirectory: string;
97
97
  generatedRouteTree: string;
@@ -9,7 +9,7 @@ import { configSchema, Config } from './core/config.js';
9
9
  * ```
10
10
  */
11
11
  declare const TanStackRouterGeneratorWebpack: (options?: Partial<{
12
- target: "react";
12
+ target: "react" | "solid";
13
13
  routeFileIgnorePrefix: string;
14
14
  routesDirectory: string;
15
15
  generatedRouteTree: string;
@@ -50,7 +50,7 @@ declare const TanStackRouterGeneratorWebpack: (options?: Partial<{
50
50
  * ```
51
51
  */
52
52
  declare const TanStackRouterCodeSplitterWebpack: (options?: Partial<{
53
- target: "react";
53
+ target: "react" | "solid";
54
54
  routeFileIgnorePrefix: string;
55
55
  routesDirectory: string;
56
56
  generatedRouteTree: string;
@@ -91,7 +91,7 @@ declare const TanStackRouterCodeSplitterWebpack: (options?: Partial<{
91
91
  * ```
92
92
  */
93
93
  declare const TanStackRouterWebpack: (options?: Partial<{
94
- target: "react";
94
+ target: "react" | "solid";
95
95
  routeFileIgnorePrefix: string;
96
96
  routesDirectory: string;
97
97
  generatedRouteTree: string;
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@tanstack/router-plugin",
3
- "version": "1.102.3",
3
+ "version": "1.102.5",
4
4
  "description": "Modern and scalable routing for React applications",
5
5
  "author": "Tanner Linsley",
6
6
  "license": "MIT",
@@ -100,15 +100,15 @@
100
100
  "chokidar": "^3.6.0",
101
101
  "unplugin": "^2.1.2",
102
102
  "zod": "^3.24.1",
103
+ "@tanstack/router-generator": "^1.102.5",
103
104
  "@tanstack/virtual-file-routes": "^1.99.0",
104
- "@tanstack/router-generator": "^1.102.3",
105
105
  "@tanstack/router-utils": "^1.102.2"
106
106
  },
107
107
  "peerDependencies": {
108
108
  "@rsbuild/core": ">=1.0.2",
109
109
  "vite": ">=5.0.0 || >=6.0.0",
110
110
  "webpack": ">=5.92.0",
111
- "@tanstack/react-router": "^1.102.3"
111
+ "@tanstack/react-router": "^1.102.5"
112
112
  },
113
113
  "peerDependenciesMeta": {
114
114
  "@rsbuild/core": {
@@ -5,8 +5,10 @@ import { deadCodeElimination } from 'babel-dead-code-elimination'
5
5
  import { generateFromAst, parseAst } from '@tanstack/router-utils'
6
6
  import { tsrSplit } from '../constants'
7
7
  import { createIdentifier } from './path-ids'
8
+ import { getFrameworkOptions } from './framework-options'
8
9
  import type { GeneratorResult, ParseAstOptions } from '@tanstack/router-utils'
9
10
  import type { CodeSplitGroupings, SplitRouteIdentNodes } from '../constants'
11
+ import type { Config } from '../config'
10
12
 
11
13
  // eslint-disable-next-line unused-imports/no-unused-vars
12
14
  const debug = process.env.TSR_VITE_DEBUG
@@ -31,7 +33,7 @@ interface State {
31
33
 
32
34
  type SplitNodeMeta = {
33
35
  routeIdent: SplitRouteIdentNodes
34
- splitStrategy: 'normal' | 'react-component'
36
+ splitStrategy: 'lazyFn' | 'lazyRouteComponent'
35
37
  localImporterIdent: string
36
38
  exporterIdent: string
37
39
  localExporterIdent: string
@@ -42,7 +44,7 @@ const SPLIT_NODES_CONFIG = new Map<SplitRouteIdentNodes, SplitNodeMeta>([
42
44
  {
43
45
  routeIdent: 'loader',
44
46
  localImporterIdent: '$$splitLoaderImporter', // const $$splitLoaderImporter = () => import('...')
45
- splitStrategy: 'normal',
47
+ splitStrategy: 'lazyFn',
46
48
  localExporterIdent: 'SplitLoader', // const SplitLoader = ...
47
49
  exporterIdent: 'loader', // export { SplitLoader as loader }
48
50
  },
@@ -52,7 +54,7 @@ const SPLIT_NODES_CONFIG = new Map<SplitRouteIdentNodes, SplitNodeMeta>([
52
54
  {
53
55
  routeIdent: 'component',
54
56
  localImporterIdent: '$$splitComponentImporter', // const $$splitComponentImporter = () => import('...')
55
- splitStrategy: 'react-component',
57
+ splitStrategy: 'lazyRouteComponent',
56
58
  localExporterIdent: 'SplitComponent', // const SplitComponent = ...
57
59
  exporterIdent: 'component', // export { SplitComponent as component }
58
60
  },
@@ -62,7 +64,7 @@ const SPLIT_NODES_CONFIG = new Map<SplitRouteIdentNodes, SplitNodeMeta>([
62
64
  {
63
65
  routeIdent: 'pendingComponent',
64
66
  localImporterIdent: '$$splitPendingComponentImporter', // const $$splitPendingComponentImporter = () => import('...')
65
- splitStrategy: 'react-component',
67
+ splitStrategy: 'lazyRouteComponent',
66
68
  localExporterIdent: 'SplitPendingComponent', // const SplitPendingComponent = ...
67
69
  exporterIdent: 'pendingComponent', // export { SplitPendingComponent as pendingComponent }
68
70
  },
@@ -72,7 +74,7 @@ const SPLIT_NODES_CONFIG = new Map<SplitRouteIdentNodes, SplitNodeMeta>([
72
74
  {
73
75
  routeIdent: 'errorComponent',
74
76
  localImporterIdent: '$$splitErrorComponentImporter', // const $$splitErrorComponentImporter = () => import('...')
75
- splitStrategy: 'react-component',
77
+ splitStrategy: 'lazyRouteComponent',
76
78
  localExporterIdent: 'SplitErrorComponent', // const SplitErrorComponent = ...
77
79
  exporterIdent: 'errorComponent', // export { SplitErrorComponent as errorComponent }
78
80
  },
@@ -82,7 +84,7 @@ const SPLIT_NODES_CONFIG = new Map<SplitRouteIdentNodes, SplitNodeMeta>([
82
84
  {
83
85
  routeIdent: 'notFoundComponent',
84
86
  localImporterIdent: '$$splitNotFoundComponentImporter', // const $$splitNotFoundComponentImporter = () => import('...')
85
- splitStrategy: 'react-component',
87
+ splitStrategy: 'lazyRouteComponent',
86
88
  localExporterIdent: 'SplitNotFoundComponent', // const SplitNotFoundComponent = ...
87
89
  exporterIdent: 'notFoundComponent', // export { SplitNotFoundComponent as notFoundComponent }
88
90
  },
@@ -111,6 +113,7 @@ export function compileCodeSplitReferenceRoute(
111
113
  opts: ParseAstOptions & {
112
114
  runtimeEnv: 'dev' | 'prod'
113
115
  codeSplitGroupings: CodeSplitGroupings
116
+ targetFramework: Config['target']
114
117
  },
115
118
  ): GeneratorResult {
116
119
  const ast = parseAst(opts)
@@ -121,6 +124,11 @@ export function compileCodeSplitReferenceRoute(
121
124
  )
122
125
  }
123
126
 
127
+ const frameworkOptions = getFrameworkOptions(opts.targetFramework)
128
+ const PACKAGE = frameworkOptions.package
129
+ const LAZY_ROUTE_COMPONENT_IDENT = frameworkOptions.idents.lazyRouteComponent
130
+ const LAZY_FN_IDENT = frameworkOptions.idents.lazyFn
131
+
124
132
  babel.traverse(ast, {
125
133
  Program: {
126
134
  enter(programPath, programState) {
@@ -202,7 +210,9 @@ export function compileCodeSplitReferenceRoute(
202
210
  codeSplitGroup,
203
211
  )
204
212
 
205
- if (splitNodeMeta.splitStrategy === 'react-component') {
213
+ if (
214
+ splitNodeMeta.splitStrategy === 'lazyRouteComponent'
215
+ ) {
206
216
  const value = prop.value
207
217
 
208
218
  let shouldSplit = true
@@ -238,12 +248,12 @@ export function compileCodeSplitReferenceRoute(
238
248
 
239
249
  if (
240
250
  !hasImportedOrDefinedIdentifier(
241
- 'lazyRouteComponent',
251
+ LAZY_ROUTE_COMPONENT_IDENT,
242
252
  )
243
253
  ) {
244
254
  programPath.unshiftContainer('body', [
245
255
  template.statement(
246
- `import { lazyRouteComponent } from '@tanstack/react-router'`,
256
+ `import { ${LAZY_ROUTE_COMPONENT_IDENT} } from '${PACKAGE}'`,
247
257
  )(),
248
258
  ])
249
259
  }
@@ -265,28 +275,30 @@ export function compileCodeSplitReferenceRoute(
265
275
  // If it's a component, we need to pass the function to check the Route.ssr value
266
276
  if (key === 'component') {
267
277
  prop.value = template.expression(
268
- `lazyRouteComponent(${splitNodeMeta.localImporterIdent}, '${splitNodeMeta.exporterIdent}', () => Route.ssr)`,
278
+ `${LAZY_ROUTE_COMPONENT_IDENT}(${splitNodeMeta.localImporterIdent}, '${splitNodeMeta.exporterIdent}', () => Route.ssr)`,
269
279
  )()
270
280
  } else {
271
281
  prop.value = template.expression(
272
- `lazyRouteComponent(${splitNodeMeta.localImporterIdent}, '${splitNodeMeta.exporterIdent}')`,
282
+ `${LAZY_ROUTE_COMPONENT_IDENT}(${splitNodeMeta.localImporterIdent}, '${splitNodeMeta.exporterIdent}')`,
273
283
  )()
274
284
  }
275
285
 
276
286
  // If the TSRDummyComponent is not defined, define it
277
287
  if (
278
288
  opts.runtimeEnv !== 'prod' && // only in development
279
- !hasImportedOrDefinedIdentifier('TSRDummyComponent')
289
+ !hasImportedOrDefinedIdentifier(
290
+ frameworkOptions.idents.dummyHMRComponent,
291
+ )
280
292
  ) {
281
293
  programPath.pushContainer('body', [
282
294
  template.statement(
283
- `export function TSRDummyComponent() { return null }`,
295
+ frameworkOptions.dummyHMRComponent,
284
296
  )(),
285
297
  ])
286
298
  }
287
299
  }
288
300
 
289
- if (splitNodeMeta.splitStrategy === 'normal') {
301
+ if (splitNodeMeta.splitStrategy === 'lazyFn') {
290
302
  const value = prop.value
291
303
 
292
304
  let shouldSplit = true
@@ -317,11 +329,11 @@ export function compileCodeSplitReferenceRoute(
317
329
  }
318
330
 
319
331
  // Prepend the import statement to the program along with the importer function
320
- if (!hasImportedOrDefinedIdentifier('lazyFn')) {
332
+ if (!hasImportedOrDefinedIdentifier(LAZY_FN_IDENT)) {
321
333
  programPath.unshiftContainer(
322
334
  'body',
323
335
  template.smart(
324
- `import { lazyFn } from '@tanstack/react-router'`,
336
+ `import { ${LAZY_FN_IDENT} } from '${PACKAGE}'`,
325
337
  )(),
326
338
  )
327
339
  }
@@ -342,7 +354,7 @@ export function compileCodeSplitReferenceRoute(
342
354
 
343
355
  // Add the lazyFn call with the dynamic import to the prop value
344
356
  prop.value = template.expression(
345
- `lazyFn(${splitNodeMeta.localImporterIdent}, '${splitNodeMeta.exporterIdent}')`,
357
+ `${LAZY_FN_IDENT}(${splitNodeMeta.localImporterIdent}, '${splitNodeMeta.exporterIdent}')`,
346
358
  )()
347
359
  }
348
360
  }
@@ -0,0 +1,47 @@
1
+ type FrameworkOptions = {
2
+ package: string
3
+ idents: {
4
+ createFileRoute: string
5
+ lazyFn: string
6
+ lazyRouteComponent: string
7
+ dummyHMRComponent: string
8
+ }
9
+ dummyHMRComponent: string
10
+ }
11
+
12
+ export function getFrameworkOptions(framework: string): FrameworkOptions {
13
+ let frameworkOptions: FrameworkOptions
14
+
15
+ switch (framework) {
16
+ case 'react':
17
+ frameworkOptions = {
18
+ package: '@tanstack/react-router',
19
+ idents: {
20
+ createFileRoute: 'createFileRoute',
21
+ lazyFn: 'lazyFn',
22
+ lazyRouteComponent: 'lazyRouteComponent',
23
+ dummyHMRComponent: 'TSRDummyComponent',
24
+ },
25
+ dummyHMRComponent: `export function TSRDummyComponent() { return null }`,
26
+ }
27
+ break
28
+ case 'solid':
29
+ frameworkOptions = {
30
+ package: '@tanstack/solid-router',
31
+ idents: {
32
+ createFileRoute: 'createFileRoute',
33
+ lazyFn: 'lazyFn',
34
+ lazyRouteComponent: 'lazyRouteComponent',
35
+ dummyHMRComponent: 'TSRDummyComponent',
36
+ },
37
+ dummyHMRComponent: `export function TSRDummyComponent() { return null }`,
38
+ }
39
+ break
40
+ default:
41
+ throw new Error(
42
+ `[getFrameworkOptions] - Unsupported framework: ${framework}`,
43
+ )
44
+ }
45
+
46
+ return frameworkOptions
47
+ }
@@ -143,6 +143,7 @@ export const unpluginRouterCodeSplitterFactory: UnpluginFactory<
143
143
  filename: id,
144
144
  runtimeEnv: isProduction ? 'prod' : 'dev',
145
145
  codeSplitGroupings: splitGroupings,
146
+ targetFramework: userConfig.target,
146
147
  })
147
148
 
148
149
  if (debug) {