title: Unable to find Vuex module action in Nuxt
body: <p>I'm working on a Nuxt site with a custom Django back end, and I'm trying to set up a mechanism where when the app loads, I call a <code>/token/</code> URL to get a CSRF token, and then store it in Vuex state to be used in a custom header that is set for every subsequent request.</p>
  
  <p>First, here is my <code>store/index.js</code>:</p>
  
  <pre><code>import Vue from 'vue'
  import Vuex from 'vuex'
  import auth from '@/store/auth'
  
  const debug = process.env.NODE_ENV !== 'production'
  
  Vue.use(Vuex)
  
  const store = () =&gt; {
    return new Vuex.Store({
      namespaced: true,
      modules: {
        auth
      }
    })
  }
  export default store
  </code></pre>
  
  <p>and <code>store/auth.js</code>:</p>
  
  <pre><code>import { SET_TOKEN } from './types'
  
  const state = () =&gt; ({
    token: ''
  })
  
  const getters = {
    token: state =&gt; state.token
  }
  
  const actions = {
    setToken({ commit, dispatch }, token) {
      commit(SET_TOKEN)
    }
  }
  
  const mutations = {
    [SET_TOKEN](state, token) {
      state.token = token
    }
  }
  
  export default {
    state,
    getters,
    mutations,
    actions
  }
  </code></pre>
  
  <p>One thing I can't figure it is where to put my mounted function so it's always triggered on page reload. In a regular Vue app, it's App.vue, but I haven't been able to find what that same thing is in Nuxt. For now, I just use <code>index.vue</code>. I'm also using the @axios Nuxt module to communicate with the back end.</p>
  
  <pre><code>&lt;script&gt;
  import Cookie from 'js-cookie'
  
  export default {
    mounted() {
      this.getCSRFToken()
    },
    methods: {
      async getCSRFToken() {
        // Call the URL that sets the csrftoken cookie
        const tokenRequest = await this.$axios.$get('/token/')
        // Get the cookie value
        const token = Cookie.get('csrftoken')
        // Save it to the store./
        this.$store.dispatch('auth/setToken', token)
      }
    }
  }
  &lt;/script&gt;
  </code></pre>
  
  <p>I can call the URL just fine and get the value from the cookie, but when I go to dispatch my action, I get an error that says <code>[vuex] unknown action type: auth/setToken</code>.</p>
  
  <p>I followed the example <a href="https://stackoverflow.com/questions/51008997/nuxt-splitting-up-vuex-store-into-separate-files-gives-error-unknown-mutation">here</a> to set up my state. My questions are these:</p>
  
  <ol>
  <li><p>What is a common starting point in Nuxt that I can use to always load this on page refresh/initial load? </p></li>
  <li><p>What do I need to change in my setup so that my action is found?</p></li>
  </ol>