Vuex

Vuex is a state management library for Vue.js applications. It provides a centralized store for all components, with rules that ensure predictable state mutations. The store contains the application state as a single source of truth. Components can read state via getters or directly, and update state only through explicit mutations or via actions that commit mutations.

Core concepts in Vuex include state, getters, mutations, actions, and modules. State holds data; getters compute derived values; mutations are synchronous functions that mutate state and must be the only way to modify state; actions can be asynchronous and commit mutations; modules allow dividing the store into smaller, namespaced units for large apps.

Usage involves creating a store instance and mounting it with the Vue app. Components access state via mapState and mapGetters, or by using this.$store. Mutations are committed with store.commit('mutationName', payload) and actions are dispatched with store.dispatch('actionName', payload).

Philosophy emphasizes a unidirectional data flow, traceable state changes, and integration with Vue devtools for time-travel debugging.

Lifecycle and versions: Vuex 4 is designed for Vue 3, while Vuex 3 targets Vue 2. A common modern alternative for Vue 3 is Pinia, which offers a lighter API and a similar concept. Plugins can extend Vuex functionality, for example to persist state across page reloads or to log mutations.