Discussion on: Building User Accounts with Nuxt, Vuex, and Firebase

[Steve]

Firstly, great article this has been very helpful, however I have run into an issue, the following is causing "Do not mutate vuex store outside mutation handlers" error to appear infinitely and crashes my browser.

auth.onAuthStateChanged((user) => {

  store.commit('setUser', user) <-- the culprit
  resolve()

})

My auth store (Using modules)
import { auth } from '~/plugins/firebase.js'

// state
export const state = () => ({
user: ''
})

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

// mutations
export const mutations = {
SET_USER (state, user) {
state.user = user
}
}

// actions
export const actions = {
setUser ({ commit, store }, payload) {
commit('SET_USER', payload)
},
signUp ({ commit }, { email, password }) {
return auth.createUserWithEmailAndPassword(email, password)
},
signInWithEmail ({ commit }, { email, password }) {
return auth.signInWithEmailAndPassword(email, password)
},
signOut () {
return auth.signOut()
}
}

export const strict = false

[Drew Clements]

Thanks for this, Steve!

It seems like this article is due for an update. This was written based off of some code that was originally written in 2018, so there are some practices (which is what you found) that aren't the 'best' anymore.

I'll put it on my to-do list to try and get this update this week. I'm sorry you ran into issues!