feat: add Vue Router 5 typed routes for TypeScript projects#957
Open
MaBbKhawaja wants to merge 1 commit intovuejs:mainfrom
Open
feat: add Vue Router 5 typed routes for TypeScript projects#957MaBbKhawaja wants to merge 1 commit intovuejs:mainfrom
MaBbKhawaja wants to merge 1 commit intovuejs:mainfrom
Conversation
…ects When both TypeScript and Vue Router are selected, the scaffolded project now includes the vue-router/vite plugin and Volar plugins for typed routes out of the box, enabling type-safe route names and automatic useRoute() typing. Closes vuejs#920
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
Summary
Closes #920
When both TypeScript and Vue Router are selected, the scaffolded project now includes Vue Router 5's typed routes configuration out of the box:
vueRouter()fromvue-router/viteas a Vite plugin (using lowercase naming per Vite conventions)tsconfig.app.jsonwithtyped-router.d.tsinclude,rootDir, and Volar plugins (sfc-typed-router,sfc-route-blocks)typed-router.d.tsto.gitignore(generated file)This does not add file-based/auto routes — it only enables typed routes for the existing manual route definitions, as discussed in the issue.
Non-TypeScript router projects are unaffected.
Generated output (TypeScript + Router)
vite.config.ts gains:
tsconfig.app.json gains:
{ "include": ["env.d.ts", "src/**/*", "src/**/*.vue", "typed-router.d.ts"], "compilerOptions": { "rootDir": "." }, "vueCompilerOptions": { "plugins": ["vue-router/volar/sfc-typed-router", "vue-router/volar/sfc-route-blocks"] } }Test plan
pnpm run snapshotand verify TypeScript + Router snapshots include the new vite plugin and tsconfig changespnpm run testto confirm existing tests pass--typescript --routerand verify typed routes work--router(no TS) and verify it's unaffected