Vue.js use method of undefined

Currently I am working with Vue CLI version ^3.0.0 and Vuex ^3.6.0, but when I want to use Vue.use(Vuex).
It says in the browser cannot read use of undefined.

Code:

main.js

import App from './App.vue'
import store from './store'

new Vue({
    store,
    render: h => h(App)
}).$mount('#app')

Store.js:

import Vue from 'vue';
import Vuex from 'Vuex';

Vue.use(Vuex);

export default Vuex.Store({
    state: {
        count: 0
    },
    mutations: {
        increment(state) {
            state.count++
        }
    }
})

enter image description here

Error received:

Uncaught TypeError: Cannot read property ‘use’ of undefined

Do you guys have any idea?

Thanks in advance.

9 thoughts on “Vue.js use method of undefined”

  1. If you’re using Vue 3, it doesn’t support global config. You’ll need to do it like this I think:

    import { createApp } from 'vue';
    import { createStore } from 'vuex';
    
    const store = createStore(
      // options
    );
    
    const app = createApp(
      // options
    );
    
    app.use(store);
    

    Also you will need to upgrade to vuex@4 for Vue 3 support.

    Reply

Leave a Comment