title: VueX - Dispatch action in a different module from an action
body: <p>I would like to clear user data upon <code>logout</code>, so from <code>auth</code> module I <code>dispatch</code> an action which is defined in a module <code>ride</code> but I am getting an error:</p>
  
  <p><code>[vuex] unknown local action type: clearUserData, global type: auth/clearUserData</code></p>
  
  <p>This is my code:</p>
  
  <h3>store/modules/auth.js</h3>
  
  <pre><code>export const namespaced = true
  
  export const mutations = {
    clearAuthData(state){
      state.apiToken = null
      state.signedIn = false
    }
  }
  
  export const actions = {
    logout({ commit, dispatch }) {
      commit('clearAuthData'))
      dispatch('ride/clearUserData', { root: true })
  
    }
  }
  </code></pre>
  
  <h3>store/modules/ride.js</h3>
  
  <pre><code>export const namespaced = true
  
  export const state = {
    data: []
  }
  
  export const mutations = {
    CLEAR_USER_DATA(state){
      state.data = []
    }
  }
  
  export const actions = {  
    clearUserData({ commit }) {
      commit('CLEAR_USER_DATA')
    }
  }
  </code></pre>
  
  <h3>store/store.js</h3>
  
  <pre><code>import * as auth from './modules/auth'
  import * as ride from './modules/ride'
  
  Vue.use(Vuex)
  
  export default new Vuex.Store({
    state: {
      loading: false
    },
    modules: {
      auth,
      ride
    }
  })
  </code></pre>
  
  <p>What am I doing wrong?</p>