Discussion on: Vuex + TypeScript

[Andrew]

Wow! I totally didn't expect that this article will be popular. Thank you for your comments.

According to the comments I've read, here is what I'm planning to include:

• how to type namespaced modules;

What do you think of idea of creating a dedicated package with helper types (MutationTree, GetterTree, ActionTree, Store)?

I also managed to type getters, rootState, rootGetters in actions and getters.

Stay tuned.

[Sören Martius]

Hey Andrew, thanks for this great example. I am currently stuck in the process of typing getters, rootState, and rootGetters in actions and getters. Any chance that you can share an example? I guess the AugmentedActionContext and Store type definitions is what I am looking for.

Thank You

[Sören Martius]

As a reference, I've uploaded a gist here: gist.github.com/soerenmartius/5f69...

The code works but typescript is unable to resolve the getters properly. Any help will be highly appreciated

[Gayrat Vlasov]

Thank you very march for great article!

You promice to add some new code as you described above.
May be you have any news about it ?

[Sergej]

Hey Andrew, any thoughts on the namespaced modules yet? Great guide otherwise!

[Andrew]

Hey Sergej, Thanks. You have to manually create MODULE_NAME/MUTATION_TYPE mappings by now. But if you are using TS 4.1 you can use Template Literal Types.

Here is the snippet from the helper library I am developing right now:

type Namespaced<T, N extends string> = {
  [P in keyof T & string as `${N}/${P}`]: T[P]
}

type NamespacedMutations = Namespaced<ArticleModuleMutations, "atricle">

[Sergej]

I see, nice trick, thanks, Andrew!

[Ricardo Vargas / Software Engineer]

Hi @3vilarthas
Did you share the update avoid the Types for rootState? I would like to see this resource. Thanks in advance!