Skip to content

Typed routes do not provide type safety #2476

@Hulkmaster

Description

@Hulkmaster

Reproduction

not applicable

Steps to reproduce the bug

import type {
  RouteRecordInfo,
} from 'vue-router';

export interface RouteNamedMap {
  // each key is a name
  home: RouteRecordInfo<
    // here we have the same name
    'home',
    // this is the path, it will appear in autocompletion
    '/',
    // these are the raw params. In this case, there are no params allowed
    Record<never, never>,
    // these are the normalized params
    Record<never, never>
  >
  // repeat for each route..
  // Note you can name them whatever you want
  'named-param': RouteRecordInfo<
    'named-param',
    '/:name',
    { name: string | number }, // raw value
    { name: string } // normalized value
  >
}

declare module 'vue-router' {
  interface TypesConfig {
    RouteNamedMap: RouteNamedMap;
  }
}

in this example if we're doing

const router = useRouter();
router.push({
  name: 'named-param,'
})

we should get error that "param 'name' is missing", because it was defined as "required" and not "optional"

but because of current types:

export interface RouteLocationAsRelativeTyped<

name and params are always optional

which mean there is only partial type safety - IF you use the param, then type will be checked, but if param is required, then you DO NOT get an error in case you forgot/removed the param

Expected behavior

get error if required params are missed

Actual behavior

required params are not enforced from typescript perspective

Additional information

No response

Metadata

Metadata

Assignees

No one assigned

    Labels

    No labels
    No labels

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions