-
Notifications
You must be signed in to change notification settings - Fork 7
Description
Currently PolyKey is using vue 2, but a... couple of weeks ago, vue 3 was released and there's a few changes that need to be made.
I'm not sure how much of the frontend work I've done with vue 3 will translate to the electron based work that is PolyKey, so I'll just cover the differences I can see as of right now. Also, it seems like you're using vuex-class which doesn't seem to support vue 3, so there's a lot of differences.
The typescript-demo-spa should be using the composition API which provides reactive states within components and helpful hooks. https://v3.vuejs.org/api/composition-api.html#setup introduces the idea.
Vuex 4 also brings some changes to the table, and I'm still figuring out some parts but I'll go over what I know.
Mutations, Actions, Getters and State are all now strongly typed in typescript, and it doesn't seem like vuex-module-decorators is supporting Vuex 4 yet. https://dev.to/3vilarthas/vuex-typescript-m4j and vuejs/vuex#994 explains the reasoning behind this, and why the $store is now manually declared. It also has an example of how to set it all up. As expected the store can be called from the vue components using a useStore hook. The article shows this more in depth.
The idea behind Mutations, Actions, Getters seems to remain the same but they are just defined in a much more verbose way without the decorators, so all the functionality should be able to remain. That said, I haven't yet looked into how to get namespaced modules in Vuex 4 though it seems like there is a way.
I can also see that you're using webpack but it seems to be an electron thing and I can't see any similarities to the webpack I've been using so there isn't much to to say there.
Vue dependencies that have been updated:
"vue": "^2.6.11"->"vue": 3.0.0"vuex": "^3.4.0"->"vuex": 4.0.0-beta.4
Not yet updated for vue 3:
vuex-classvuex-module-decoratorsvue-property-decoratorThough support is planned for this Vue 3.0 support kaorun343/vue-property-decorator#294vue-class-componentvue-styled-components