Help needed -> app.use(Vuex) not working

Hello everyone!

I have this code:

import { createApp } from 'vue'
import App from './App.vue'
import router from './router';
import Vuex from 'vuex'
import { store } from "./store/store";

import { IonicVue } from '@ionic/vue';

const app = createApp(App)
  .use(IonicVue)
  .use(router);

router.isReady().then(() => {
  app.mount('#app');
  app.use(Vuex)
  app.use(store);
});

But then I get this error:

[vue-cli-service]     Types of property 'install' are incompatible.
[vue-cli-service]       Type '(Vue: typeof import("C:/Users/USER/Documents/KwekerijVH/voorraadsysteem-mobile/node_modules/vue/dist/vue")) => void' is not assignable to type 'PluginInst
allFunction'.
[vue-cli-service]         Types of parameters 'Vue' and 'app' are incompatible.
[vue-cli-service]           Type 'App<any>' is missing the following properties from type 'typeof import("C:/Users/USER/Documents/KwekerijVH/voorraadsysteem-mobile/node_modules/vue/dis
t/vue")': compile, useCssModule, useCssVars, createApp, and 110 more.
[vue-cli-service]     32 | router.isReady().then(() => {
[vue-cli-service]     33 |   app.mount('#app');
[vue-cli-service]   > 34 |   app.use(Vuex)
[vue-cli-service]        |           ^^^^

Does anybody know why I get these errors?

Are you using TypeScript and wanting to have a typed store? If so, check out this post - Managing State in Vue with Vuex - Ionic Blog. That tutorial has a sample repo as well here.

My guess though is that you are registering the store incorrectly. It should look something like this:

const app = createApp(App)
    .use(IonicVue)
    .use(router)
    .use(store)

router.isReady().then(() => {
    app.mount('#app')
})

As a side note, I would highly recommend having a typed store. I switched to un-typed and then back. Having types is soooo much better :slight_smile: even though it takes a little more setup and code.