Skip to content

fix(types): wire RouteNamedMap via generated routes.d.ts#2700

Merged
posva merged 2 commits intomainfrom
fix/typed-routes-without-auto-routes-import
May 6, 2026
Merged

fix(types): wire RouteNamedMap via generated routes.d.ts#2700
posva merged 2 commits intomainfrom
fix/typed-routes-without-auto-routes-import

Conversation

@posva
Copy link
Copy Markdown
Member

@posva posva commented May 6, 2026

Summary

  • Closes [Experimental router]: `RouteNameMap` not working because `vue-router/auto-routes` is never imported #2696
  • Move the TypesConfig.RouteNamedMap augmentation out of vue-router-auto-routes.d.mts and into the generated routes.d.ts. The previous wiring only fired when the project actually imported vue-router/auto-routes, so resolver-only setups (vue-router/auto-resolver) silently fell back to RouteMapGeneric and useRoute() lost typed params.
  • The generated .d.ts is always part of the user's tsconfig include, so the augmentation now applies regardless of which virtual module the user imports (or even if they only rely on the Volar plugins).

The generated block now looks like:

declare module 'vue-router' {
  interface TypesConfig {
    ParamParsers: 
    RouteNamedMap: import('vue-router/auto-routes').RouteNamedMap
  }
}

The RouteNamedMap interface body still lives inside declare module 'vue-router/auto-routes' in the generated file, so existing user augmentations of that interface keep working.

Test plan

  • New regression test in generateDTS.spec.ts asserting RouteNamedMap is wired through the vue-router augmentation block (fails on main, passes here)
  • pnpm exec vitest run in packages/router — full suite (1563 tests) green, snapshot updated
  • pnpm types (vue-tsc) in packages/playground-file-based with src/router/classic.ts (the only auto-routes consumer) removed — typed routes still resolve and the @ts-expect-error assertions in resolver.ts still trigger
  • Reviewer sanity check: existing imports of RouteNamedMap from vue-router/auto-routes still resolve (interface is still exported there)

Summary by CodeRabbit

  • New Features

    • Added support for new dynamic route patterns with multiple parameters.
    • Enhanced TypeScript type support for improved route name autocomplete and type safety.
  • Tests

    • Added test coverage for route type augmentation.

Move the `TypesConfig.RouteNamedMap` augmentation out of
`vue-router-auto-routes.d.mts` and into the generated `routes.d.ts`
emitted by the unplugin. The previous wiring only activated when the
project actually imported `vue-router/auto-routes`, so resolver-only
setups (`vue-router/auto-resolver`) collapsed `RouteMap` to
`RouteMapGeneric` and `useRoute()` returned untyped params.

The generated d.ts is always part of the user's tsconfig `include`, so
the augmentation now applies regardless of which virtual module the
user imports.

Closes #2696
@netlify
Copy link
Copy Markdown

netlify Bot commented May 6, 2026

Deploy Preview for vue-router canceled.

Name Link
🔨 Latest commit e78a32d
🔍 Latest deploy log https://app.netlify.com/projects/vue-router/deploys/69fb45c180ff1f00084c917d

@pkg-pr-new
Copy link
Copy Markdown

pkg-pr-new Bot commented May 6, 2026

Open in StackBlitz

npm i https://pkg.pr.new/vue-router@2700

commit: e38723b

@coderabbitai
Copy link
Copy Markdown
Contributor

coderabbitai Bot commented May 6, 2026

Caution

Review failed

The pull request is closed.

ℹ️ Recent review info
⚙️ Run configuration

Configuration used: Path: .coderabbit.yaml

Review profile: CHILL

Plan: Pro

Run ID: 1a0eab1e-fb70-4c91-b9dd-1e4498b1cf1c

📥 Commits

Reviewing files that changed from the base of the PR and between c807486 and e78a32d.

📒 Files selected for processing (4)
  • packages/playground-file-based/src/routes.d.ts
  • packages/router/src/unplugin/codegen/generateDTS.spec.ts
  • packages/router/src/unplugin/codegen/generateDTS.ts
  • packages/router/vue-router-auto-routes.d.mts

📝 Walkthrough

Walkthrough

The PR introduces a RouteNamedMap type that augments vue-router's TypesConfig and wires it through the type generation pipeline. This includes updating base type declarations, modifying code generation logic, adding test coverage, and updating example generated types.

Changes

RouteNamedMap Type Wiring

Layer / File(s) Summary
Base Type Definition
packages/router/vue-router-auto-routes.d.mts
RouteNamedMap interface is defined and exported; module augmentation structure is replaced with direct interface export.
Code Generation
packages/router/src/unplugin/codegen/generateDTS.ts
Codegen updated to include RouteNamedMap: import('${routesModule}').RouteNamedMap property in the generated TypesConfig augmentation for vue-router.
Test Coverage
packages/router/src/unplugin/codegen/generateDTS.spec.ts
New test "wires RouteNamedMap into the vue-router TypesConfig augmentation" verifies the RouteNamedMap signature is present in generated declare module 'vue-router' blocks.
Generated Types
packages/playground-file-based/src/routes.d.ts
TypesConfig augmentation includes RouteNamedMap property; route file updated from [a].[b].vue to multi.[a].[b].vue with corresponding RouteNamedMap and RouteFileInfoMap entries.

Estimated code review effort

🎯 3 (Moderate) | ⏱️ ~20 minutes

Possibly related PRs

  • vuejs/router#2564: Introduces RouteNamedMap type and vue-router TypesConfig augmentation alongside documentation updates.
  • vuejs/router#2624: Relaxes generic constraints on RouteNamedMap to accept interface-shaped implementations.
  • vuejs/router#2688: Fixes a syntax bug in generated import statements alongside DTS generation updates.

Suggested reviewers

  • edison1105
  • LittleSound

Poem

🐰 A new RouteNamedMap hops into place,
Wired through codegen with elegant grace!
Types flow and augment with TypesConfig care,
From base definitions to routes everywhere. ✨

✨ Finishing Touches
📝 Generate docstrings
  • Create stacked PR
  • Commit on current branch
🧪 Generate unit tests (beta)
  • Create PR with unit tests
  • Commit unit tests in branch fix/typed-routes-without-auto-routes-import

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.

[skip ci]
@posva posva merged commit aef9941 into main May 6, 2026
4 checks passed
@posva posva deleted the fix/typed-routes-without-auto-routes-import branch May 6, 2026 13:45
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

1 participant