I have setup a default store in Nuxt in store/index.js as the documentation remends. When I try to render my app I'm getting the following error:

Uncaught Error: [nuxt] store/index.js should export a method that returns a Vuex instance.

My store/index.js file looks like this:

import Vuex from 'vuex'
import Vue from 'vue'
import myModule from './myModule'

Vue.use(Vuex)

const store = new Vuex.Store({
  state: () => ({

  }),
  mutations: {},
  actions: {},
  modules: {
    myModule: myModule
  }
})
export default store

How do I handle this?

I have setup a default store in Nuxt in store/index.js as the documentation remends. When I try to render my app I'm getting the following error:

Uncaught Error: [nuxt] store/index.js should export a method that returns a Vuex instance.

My store/index.js file looks like this:

import Vuex from 'vuex'
import Vue from 'vue'
import myModule from './myModule'

Vue.use(Vuex)

const store = new Vuex.Store({
  state: () => ({

  }),
  mutations: {},
  actions: {},
  modules: {
    myModule: myModule
  }
})
export default store

How do I handle this?

• javascript
• vue.js
• nuxt.js
• vuex
• store

2 Answers 2

You are exporting the Vuex store as a constant, you should export a default method that returns the Vuex store instance.

Your store/index.js file should look like this:

import Vuex from 'vuex'
import Vue from 'vue'
import myModule from './myModule'

Vue.use(Vuex)

export default () => new Vuex.Store({
  state: () => ({

  }),
  mutations: {},
  actions: {},
  modules: {
    myModule: myModule
  }
})

I do have the following and it's working great.

import { test } from './modules/tasty_module'

const state = () => ({})
const mutations = {}
const actions = {}
const getters = {}

export default {
  state,
  mutations,
  getters,
  actions,
  modules: {
    testModule: test,
  },
}