What causes "[vuex] error in error action subscribers: " in vuejs/vuex?

Guard against arbitrary rejection values (typeof error === 'object', optional chaining on error.response)

[vuex] error in error action subscribers:

Error message

[vuex] error in error action subscribers:

What it means

An error subscriber (subscribeAction error handler, Vuex 3.6+) threw while processing a failed action. Vuex catches it so the original action rejection is still propagated, logging a dev warning and the subscriber error.

Source

Thrown at src/store.js:190

        try {
          this._actionSubscribers
            .filter(sub => sub.after)
            .forEach(sub => sub.after(action, this.state))
        } catch (e) {
          if (__DEV__) {
            console.warn(`[vuex] error in after action subscribers: `)
            console.error(e)
          }
        }
        resolve(res)
      }, error => {
        try {
          this._actionSubscribers
            .filter(sub => sub.error)
            .forEach(sub => sub.error(action, this.state, error))
        } catch (e) {
          if (__DEV__) {
            console.warn(`[vuex] error in error action subscribers: `)
            console.error(e)
          }
        }
        reject(error)
      })
    })
  }

  subscribe (fn, options) {
    return genericSubscribe(fn, this._subscribers, options)
  }

  subscribeAction (fn, options) {
    const subs = typeof fn === 'function' ? { before: fn } : fn
    return genericSubscribe(subs, this._actionSubscribers, options)
  }

  watch (getter, cb, options) {

View on GitHub (pinned to bd907467b8)

Solutions

Guard against arbitrary rejection values (typeof error === 'object', optional chaining on error.response)
Fix the handler per the logged console.error(e)
Wrap handler body in try/catch so error reporting never throws
Confirm all three subscriber hooks use (action, state, error) signatures

Example fix

// before
subscribeAction: { error: (action, state, error) => report(error.response.status) }
// after
subscribeAction: { error: (action, state, error) => report(error && error.response ? error.response.status : error) }

Defensive patterns

Strategy: try-catch

Validate before calling

function safeErrorSubscriber(fn) {
  return (action, state, error) => { try { fn(action, state, error) } catch (e) { console.warn('error subscriber failed', e) } }
}
// register: subscribeAction({ error: safeErrorSubscriber(report) })

Type guard

function isHttpError(e) {
  return e instanceof Error && 'response' in e && typeof e.response?.status === 'number'
}

Try / catch

store.subscribeAction({
  error(action, state, error) {
    try {
      const status = error?.response?.status ?? 'unknown'
      report(action.type, status)
    } catch (e) { console.warn('[vuex] error reporter failed', e) }
  }
})

Prevention

Treat rejection values as unknown (can be strings/objects, not always Error)
Guard HTTP-specific fields (error.response) with optional chaining
Never let the error reporter itself throw — it masks the real failure
Keep error subscriber signature (action, state, error) per Vuex 3.6+ docs

When it happens

Trigger: subscribeAction({ error(action, state, error) { ... } }) throwing when an action rejects — e.g. assuming error.response exists on network errors, or non-Error rejection values.

Common situations: Axios error handling in the subscriber assuming a response object; error reporter plugins choking on string rejections; handlers written before the error-hook existed receiving unexpected arguments.

Related errors

AI-assisted analysis of vuejs/vuex@bd907467b8 (2026-08-28). Data as JSON: /api/errors/d270996cceb68a8b. Report an issue: GitHub.