VueX 4 With Typescript And Decorators | Tutorial

VueX with Typescript can be easy, you just need to use one package.

#typescript #vue #vuex

[heliumracoon]

So far the best video I found for vuex-module-decorators in vue3, typescript, vuex4. In combination with official docs a great kickstart on this topic.

[phuntsok]

Amazing! had been pulling my hair understanding TS implementation on vuex. you have saved my hair😉 Thanks a lot

[allothernameswherealreadytaken]

Thank you very much!
I've been looking at a lot of different approaches and tutorials trying to understand the best way to use Vuex 4 with typescript and this was by far the most elegant solution!

[Myself]

Thanks man. I was terrified by amount of boilerplate typescript vue requires.
But this stuff helps to reduce it to even smaller amount that is in classic js vue.

[maskman]

Thank you man, this is a great example of using vuex with typescript in composition-api, nice job !!!

[LucTemetNosce]

Wow! So simple! This needs more views. It's like 10x easier than the other vuex typescript tutorials in here.

[szyszak]

Great tutorial. I've just started learning Vue and was pretty disappointed with weak TypeScript support in Vuex. Could you create a repo on GitHub with this code for future reference and add a link in the description? This would help a lot. Cheers.

[muhamedahmatovic]

So with this I don't need to use injectionKeys, define separately action/mutation types just to get typescript when using commit or dispatch? This is genius. Decorators ftw!

[binoysarker]

how can i use nuxtServerInit using this package in nuxt js project

[kurasaored]

Have you used this in production with Vue3?

[heliumracoon]

Question: With this setup, when I change something and save, in the console appears: "[vuex] duplicate namespace Title/ for the namespaced module Title vuex.esm-browser.js:677
[vuex] state field "Title" was overridden by a module with the same name at "Title"".

Does anybody now, how I can solve this?