title: cannot read property 'dispatch' of undefined in Vuex
body: <p>I'm trying to perform a dispatch on 'logOutUser' in vuex store, and i'm getting the following error message in respone:</p>
  
  <blockquote>
    <p>TypeError: Cannot read property 'dispatch' of undefined</p>
  </blockquote>
  
  <p>deleteUser.vue (the component from which the dispatch action is not working):</p>
  
  <pre><code>&lt;template&gt;
      &lt;v-dialog v-model="openDelete" persistent max-width="500px"&gt;
          &lt;v-card&gt;
              &lt;v-card-title&gt;
                  &lt;h4&gt;Delete User&lt;/h4&gt;
              &lt;/v-card-title&gt; 
              &lt;v-card-text&gt;
                  &lt;h2&gt;Are You Sure?&lt;/h2&gt;
                  &lt;p&gt;Deleting your user is a permanent action.&lt;/p&gt;
                  &lt;br&gt;
                  &lt;br&gt;
                  &lt;v-btn
                   color="primary"
                   @click="deleteUser"&gt;
                   Delete User
                  &lt;/v-btn&gt;
                  &lt;v-btn
                   color="primary"
                   @click="openDelete = false"&gt;
                   Close
                  &lt;/v-btn&gt;  
              &lt;/v-card-text&gt;  
          &lt;/v-card&gt;   
      &lt;/v-dialog&gt; 
  &lt;/template&gt;
  &lt;script&gt;
  import router from '../../router/index.js'
  const firebase = require('../../firebaseConfig.js')
  export default {
      data: function(){
          return {
              openDelete: true
          }
      },
      methods: {
          deleteUser: function(){
              let user = firebase.auth.currentUser
              const docId = user.uid
              console.log("Trying to delete user ", docId)
              user.delete().then(function() {
              }).catch(function(error) {
                  console.error("Error deleting user: ", error)
              });
              firebase.firestore.collection("users").doc(docId).delete().then(() =&gt; {
                          console.log('Trying to Log Out in Vuex')
                          this.$store.dispatch('user/logOutUser')
                          alert("User Deleted Successfully!")
                  }).catch(function(error) {
                      console.error("Error removing document: ", error);
                  });
              router.push('hello')    
              this.openDelete = false
          }
      }
  }
  &lt;/script&gt;
  </code></pre>
  
  <p>store.js:</p>
  
  <pre><code>import Vue from 'vue'
  import Vuex from 'vuex'
  import user from './modules/user'
  import genre from './modules/genre'
  
  Vue.use(Vuex)
  
  export default new Vuex.Store({
      modules: {
          user,
          genre
      }
  })
  </code></pre>
  
  <p>user.js:</p>
  
  <pre><code>const firebase=require('../firebaseConfig.js')
  
  const state = {
      currentUser: null,
      userProfile: {}
  }
  
  const actions = {
          fetchUserProfile({commit, state}, uid){
              firebase.firestore.collection("users").doc(uid).get().then((doc)=&gt;{
                  commit('setUserProfile', doc.data())
              }).catch((error)=&gt;{
                  console.error(error)
              })
          },
          logOutUser({commit, state}){
              commit('setCurrentUser', null)
              commit('setUserProfile', {})
              console.log('Logged Out In Vuex')
          }
  }
  
  const mutations = 
      {
          setCurrentUser(state, val){
              state.currentUser = val
          },
          setUserProfile(state, val){
              state.userProfile = val
          }
      }
  
  export default {
      namespaced: true,
      state,
      actions,
      mutations
  }   
  </code></pre>
  
  <p>EDIT: Here's my main.js file:</p>
  
  <pre><code>import Vue from 'vue'
  import App from './App'
  import router from './router'
  import store from './store.js'
  const firebase = require('./firebaseConfig.js')
  
  Vue.config.productionTip = false
  
  let app
  
  firebase.auth.onAuthStateChanged(user =&gt; {
    if(!app){
      /* eslint-disable no-new */
      app = new Vue({
        el: '#app',
        router,
        store,
        components: { App },
        template: '&lt;App/&gt;'
      })
    }
  });
  </code></pre>
  
  <p>I should mention that i'm dispatching this action from another component in my application, and it works perfectly fine from there.</p>
  
  <p>Thank you!</p>