Vue router by birkskyum · Pull Request #5997 · TanStack/router

birkskyum · 2025-11-30T01:13:55Z

Since a Vue single-file component (SFC) only can export one component, and most tanstack router routes export multiple (main component, error compoentn, not found component etc.) the iteration here uses either JSX or multiple vue files like this:

File-Based Routing Conventions

optional vue-specific route files

Suffix/Pattern	Purpose
`.component.vue`	The component rendered for the route
`.errorComponent.vue`	Error boundary component for the route
`.notFoundComponent.vue`	Not found component for the route
`.pendingComponent.vue`	Pending component for the route

existing

Suffix/Pattern	Purpose
`.ts`	Route configuration (loader, validateSearch, head, etc.)
`.lazy.ts`	Lazy-loaded route configuration
`_layout` prefix	Layout routes that wrap child routes
`_` suffix (e.g., `posts_.$postId`)	Unnested routes (break out of parent layout)
`(groupName)` directory	Route groups (organizational, don't affect URL)
`$param`	Dynamic route parameters

coderabbitai · 2025-11-30T01:14:00Z

Important

Review skipped

More than 25% of the files skipped due to max files limit. The review is being skipped to prevent a low-quality review.

193 files out of 300 files are above the max files limit of 100. Please upgrade to Pro plan to get higher limits.

You can disable this status message by setting the reviews.review_status to false in the CodeRabbit configuration file.

✨ Finishing touches

📝 Generate docstrings

🧪 Generate unit tests (beta)

Create PR with unit tests
Post copyable unit tests in a comment
Commit unit tests in branch vue-router

Thanks for using CodeRabbit! It's free for OSS, and your support helps us grow. If you like it, consider giving us a shout-out.

❤️ Share

_{Comment @coderabbitai help to get the list of available commands and usage tips.}

nx-cloud · 2025-11-30T01:14:29Z

View your CI Pipeline Execution ↗ for commit a878fce

Command	Status	Duration	Result
`nx affected --targets=test:eslint,test:unit,tes...`	✅ Succeeded	6m 35s	View ↗
`nx run-many --target=build --exclude=examples/*...`	✅ Succeeded	4s	View ↗

☁️ Nx Cloud last updated this comment at 2025-12-06 18:27:56 UTC

pkg-pr-new · 2025-11-30T01:17:56Z

More templates

@tanstack/arktype-adapter

npm i https://pkg.pr.new/TanStack/router/@tanstack/arktype-adapter@5997

@tanstack/directive-functions-plugin

npm i https://pkg.pr.new/TanStack/router/@tanstack/directive-functions-plugin@5997

@tanstack/eslint-plugin-router

npm i https://pkg.pr.new/TanStack/router/@tanstack/eslint-plugin-router@5997

@tanstack/history

npm i https://pkg.pr.new/TanStack/router/@tanstack/history@5997

@tanstack/nitro-v2-vite-plugin

npm i https://pkg.pr.new/TanStack/router/@tanstack/nitro-v2-vite-plugin@5997

@tanstack/react-router

npm i https://pkg.pr.new/TanStack/router/@tanstack/react-router@5997

@tanstack/react-router-devtools

npm i https://pkg.pr.new/TanStack/router/@tanstack/react-router-devtools@5997

@tanstack/react-router-ssr-query

npm i https://pkg.pr.new/TanStack/router/@tanstack/react-router-ssr-query@5997

@tanstack/react-start

npm i https://pkg.pr.new/TanStack/router/@tanstack/react-start@5997

@tanstack/react-start-client

npm i https://pkg.pr.new/TanStack/router/@tanstack/react-start-client@5997

@tanstack/react-start-server

npm i https://pkg.pr.new/TanStack/router/@tanstack/react-start-server@5997

@tanstack/router-cli

npm i https://pkg.pr.new/TanStack/router/@tanstack/router-cli@5997

@tanstack/router-core

npm i https://pkg.pr.new/TanStack/router/@tanstack/router-core@5997

@tanstack/router-devtools

npm i https://pkg.pr.new/TanStack/router/@tanstack/router-devtools@5997

@tanstack/router-devtools-core

npm i https://pkg.pr.new/TanStack/router/@tanstack/router-devtools-core@5997

@tanstack/router-generator

npm i https://pkg.pr.new/TanStack/router/@tanstack/router-generator@5997

@tanstack/router-plugin

npm i https://pkg.pr.new/TanStack/router/@tanstack/router-plugin@5997

@tanstack/router-ssr-query-core

npm i https://pkg.pr.new/TanStack/router/@tanstack/router-ssr-query-core@5997

@tanstack/router-utils

npm i https://pkg.pr.new/TanStack/router/@tanstack/router-utils@5997

@tanstack/router-vite-plugin

npm i https://pkg.pr.new/TanStack/router/@tanstack/router-vite-plugin@5997

@tanstack/server-functions-plugin

npm i https://pkg.pr.new/TanStack/router/@tanstack/server-functions-plugin@5997

@tanstack/solid-router

npm i https://pkg.pr.new/TanStack/router/@tanstack/solid-router@5997

@tanstack/solid-router-devtools

npm i https://pkg.pr.new/TanStack/router/@tanstack/solid-router-devtools@5997

@tanstack/solid-router-ssr-query

npm i https://pkg.pr.new/TanStack/router/@tanstack/solid-router-ssr-query@5997

@tanstack/solid-start

npm i https://pkg.pr.new/TanStack/router/@tanstack/solid-start@5997

@tanstack/solid-start-client

npm i https://pkg.pr.new/TanStack/router/@tanstack/solid-start-client@5997

@tanstack/solid-start-server

npm i https://pkg.pr.new/TanStack/router/@tanstack/solid-start-server@5997

@tanstack/start-client-core

npm i https://pkg.pr.new/TanStack/router/@tanstack/start-client-core@5997

@tanstack/start-plugin-core

npm i https://pkg.pr.new/TanStack/router/@tanstack/start-plugin-core@5997

@tanstack/start-server-core

npm i https://pkg.pr.new/TanStack/router/@tanstack/start-server-core@5997

@tanstack/start-static-server-functions

npm i https://pkg.pr.new/TanStack/router/@tanstack/start-static-server-functions@5997

@tanstack/start-storage-context

npm i https://pkg.pr.new/TanStack/router/@tanstack/start-storage-context@5997

@tanstack/valibot-adapter

npm i https://pkg.pr.new/TanStack/router/@tanstack/valibot-adapter@5997

@tanstack/virtual-file-routes

npm i https://pkg.pr.new/TanStack/router/@tanstack/virtual-file-routes@5997

@tanstack/vue-router

npm i https://pkg.pr.new/TanStack/router/@tanstack/vue-router@5997

@tanstack/vue-router-devtools

npm i https://pkg.pr.new/TanStack/router/@tanstack/vue-router-devtools@5997

@tanstack/vue-router-ssr-query

npm i https://pkg.pr.new/TanStack/router/@tanstack/vue-router-ssr-query@5997

@tanstack/zod-adapter

npm i https://pkg.pr.new/TanStack/router/@tanstack/zod-adapter@5997

commit: a878fce

packages/vue-router-devtools/README.md

packages/vue-router-devtools/tsconfig.build.json

SeanCassiere · 2025-12-05T22:34:45Z

packages/vue-router/src/ScrollRestoration.tsx

+/**
+ * @deprecated use createRouter's `scrollRestoration` option instead
+ */
+export function ScrollRestoration(_props: ScrollRestorationOptions) {


Do we need to provide this component?

React/Solid has this - why would specifically vue-router not need this component?

github-actions bot added package: router-plugin package: router-generator labels Nov 30, 2025

birkskyum changed the title ~~Vue router RFC~~ Vue router Dec 3, 2025

birkskyum marked this pull request as ready for review December 3, 2025 02:55

birkskyum force-pushed the vue-router branch from ce11f53 to 51c15a5 Compare December 3, 2025 04:26

SeanCassiere reviewed Dec 5, 2025

View reviewed changes

birkskyum added 21 commits December 6, 2025 19:17

first pass

be45562

calling .value on refs

02c1c7e

use template

3cc7f04

more work on jsx

e91cd1a

fix routerprovider type test

766dbc6

fix matches type test

3cafedb

fix link type test

e04c351

cleanup additionalProps

4b3188c

align vue to solid/react

e2f113d

work on routerContext

30ec806

use getRouterContext

4e26469

vue example

c73df72

work on devtools

e7cbda7

less noisy catch boundary

7633973

working devtools

5a13afb

add the devtools panel

87d68ed

fix loading of posts

bb2ae24

add vue to router-plugin

0c7ddc9

add basic-file-based-jsx

000532f

.value instead of ()

3a98d8c

remove double dash

61df0cc

birkskyum and others added 24 commits December 6, 2025 19:18

dont use .route.ts syntax

912d68b

clen utils

76e598b

update vue examples

4e61d50

add vue logo

023f05c

add eslint file

4ad1d6b

adjust examples

467f678

lockfile

99a0561

add vue plugin

9a564be

fix e2e

6d54d21

remove redundant files

1050284

vue-tsc

3c022a5

ci: apply automated fixes

8de98b7

add to publish

2cf1238

fix e2e

0afd238

ci: apply automated fixes

5a38b9e

add vue-router-devtools to publish

467ea37

use workspace for example until first public release

0a352ff

cleanup lock

932c65f

fix e2e

dc73cb5

use workspace until public release

722e85b

vue-router-ssr-query

08977e3

update readme

2eb4154

lockfile

b97d273

reomve tsconfig.build.json

c21a82b

birkskyum force-pushed the vue-router branch from ed58a3e to c21a82b Compare December 6, 2025 18:18

ci: apply automated fixes

a878fce

birkskyum merged commit 3d6aa41 into main Dec 6, 2025
6 checks passed

birkskyum deleted the vue-router branch December 6, 2025 18:41

birkskyum mentioned this pull request Dec 10, 2025

Vue start #6055

Merged

naoya7076 pushed a commit to naoya7076/router that referenced this pull request Feb 15, 2026

Vue router (TanStack#5997)

8bdc197

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

Uh oh!

Vue router#5997

Vue router#5997
birkskyum merged 114 commits intomainfrom
vue-router

birkskyum commented Nov 30, 2025 •

edited

Loading

Uh oh!

coderabbitai bot commented Nov 30, 2025 •

edited

Loading

Review skipped

Uh oh!

nx-cloud bot commented Nov 30, 2025 •

edited

Loading

Uh oh!

pkg-pr-new bot commented Nov 30, 2025 •

edited

Loading

Uh oh!

Uh oh!

Uh oh!

SeanCassiere Dec 5, 2025

Uh oh!

birkskyum Dec 6, 2025

Uh oh!

Uh oh!

Reviewers

Assignees

Labels

Projects

Milestone

Development

Uh oh!

2 participants

Uh oh!

Conversation

birkskyum commented Nov 30, 2025 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

File-Based Routing Conventions

Uh oh!

coderabbitai bot commented Nov 30, 2025 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Review skipped

Uh oh!

nx-cloud bot commented Nov 30, 2025 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Uh oh!

pkg-pr-new bot commented Nov 30, 2025 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Uh oh!

Uh oh!

Uh oh!

SeanCassiere Dec 5, 2025

Choose a reason for hiding this comment

Uh oh!

birkskyum Dec 6, 2025

Choose a reason for hiding this comment

Uh oh!

Uh oh!

Reviewers

Assignees

Labels

Projects

Milestone

Development

Uh oh!

2 participants

birkskyum commented Nov 30, 2025 •

edited

Loading

coderabbitai bot commented Nov 30, 2025 •

edited

Loading

nx-cloud bot commented Nov 30, 2025 •

edited

Loading

pkg-pr-new bot commented Nov 30, 2025 •

edited

Loading