Home

Using vuex modules in my project and I have the following project structure

store

• index.js
• auth.js

In my index.js I have the following example

export const state = () => ({
  test: null
})

export const mutations = {
  SET_TEST(state, test){
    console.log('SET_TEST', test)
    state.test = test;
  }
}

export const actions = () => ({
   nuxtServerInit({ commit }, { req }) {
     console.log('calling nuxtServerInit')
      const test = { foo: 'bar'}
      commit('SET_TEST', test)
      if (req.session && req.session.user) {
         commit('auth/SET_USER', req.session.user)
      }
    }
})

and in my auth.js

import axios from 'axios';

export const state = () => ({
  user: null
})

export const mutations = {
  SET_USER(state, user){
    console.log('setUser', user)
    state.user = user || null
  }
}

export const getters = {
  isAuthenticated(state){
    return !!state.user
  },
  loggedUser(state){
    return state.user
  }
  
}

export const actions = {
  setUser({ commit }, user) {
    commit('SET_USER', user)
  },

  saveUser({state}) {
    return axios.put('/api/user', { user: state.user})
  }
}

But it seems that nuxtServerInit() in never called. I don’t see the console.log('calling nuxtServerInit') and the test state and user state are both empty.

Not sure what i’m doing wrong.