types: add RouteMeta interface to enable module augmentation

[HoldYourWaffle]

Close #3183

I added a RouteMeta interface to the type declarations to allow for stronger type safety using module augmentation.

For example:

declare module 'vue-router/types/router' {
    interface RouteMeta {
        x: string;
    }
}

Would define myRoute.meta.x to be a string. Non-existent properties will show an error.

Unfortunately this is a (minor) breaking change. As far as I know this can't be avoided without sacrificing the added type-safety.
Users can manually revert to the original "any" behavior using an augmentation like this:

declare module 'vue-router/types/router' {
    interface RouteMeta {
        [key: string]: any;
    }
}

I can't make this the default however, because it can't be overwritten using module augmentation.
In other words: the "any"-index type would stay "active", thus defeating the purpose of added type-safety.

I hope this suggestion can be considered nonetheless.

[posva]

Thanks, can you make like the existing one at vuejs/router#407 and add a test?

[HoldYourWaffle]

@posva Although better than using plain any, I don't think having RouteMeta extend Record<..., any> is the best way here.
Like I mentioned in my initial comment, this kind of defeats the purpose of the added type safety.

It's better than nothing of course, since properties that have been declared will have their appropriate types.
However, invalid (undeclared) properties will not cause an error, meaning that things like typo's will go unnoticed.

Therefore I'd propose leaving this "Record extension" up to the user. Then anyone who wants to is free to have their RouteMeta extend it, but it won't be forced on all the others.

[posva]

For Vue Router 3, that would be a breaking change, so we will have to keep any, but it can maybe be changed to unknown in v4 (vue-router-next)

[HoldYourWaffle]

I suppose that's the only way then. I'll update this as soon as I get back to my workspace.
Should I create a PR to vue-router-next as well for changing any to unknown?

[posva]

Sure! Let's see if existing tests pass and if the change is reasonable

[posva]

The last thing that needs to be done here is to export RouteMeta from index.d.ts and add a test at https://github.com/vuejs/vue-router/tree/dev/types/test 🙂