CHANGELOG.md 25 KB

4.1.0 (2022-10-14)

Vue Core Version Requirement Change

This release contains an important fix (#1883) that relies on the effectScope API from Vue core, which is only available in Vue 3.2+.

Bug Fixes

4.0.2 (2021-06-17)

Bug Fixes

  • devtools: fix no getters displayed on root module + better getters inspector (#1986) (bc20295)
  • build: cjs build failing due to __VUE_PROD_DEVTOOLS__ defined (#1991) (#1992) (7151622)

4.0.1 (2021-05-24)

Features

  • dx: add devtools integration (#1949)

4.0.0 (2021-02-02)

This is the official Vuex 4 release.

The focus for Vuex 4 is compatibility. Vuex 4 supports Vue 3, and it provides the exact same API as Vuex 3, so users can reuse their existing Vuex code with Vue 3.

There are a few breaking changes described in a later section, so please check them out.

You can find basic usage with both Option and Composition API in the example directory.

It's still released under next tag in NPM package as same as Vue 3. We're planning to remove next tag once Vue 3 is ready to remove it.

There have been a lot of contribution to make Vuex 4 stable. Thank you all for your very much appreciated help. It wouldn't have been possible without this wonderful Vue community!

Documentation

To check out docs, visit next.vuex.vuejs.org.

Breaking changes

Installation process has changed

To align with the new Vue 3 initialization process, the installation process of Vuex has changed.

To create a new store instance, users are now encouraged to use the newly introduced createStore function.

import { createStore } from 'vuex'

export const store = createStore({
  state() {
    return {
      count: 1
    }
  }
})

Whilst this is not technically a breaking change, you may still use the new Store(...) syntax, we recommend this approach to align with Vue 3 and Vue Router Next.

To install Vuex to a Vue instance, pass the store instance instead of Vuex.

import { createApp } from 'vue'
import { store } from './store'
import App from './App.vue'

const app = createApp(App)

app.use(store)

app.mount('#app')

Bundles are now aligned with Vue 3

The following bundles are generated to align with Vue 3 bundles:

  • vuex.global(.prod).js
    • For direct use with <script src="..."> in the browser. Exposes the Vuex global.
    • Global build is built as IIFE, and not UMD, and is only meant for direct use with <script src="...">.
    • Contains hard-coded prod/dev branches and the prod build is pre-minified. Use the .prod.js files for production.
  • vuex.esm-browser(.prod).js
    • For use with native ES module imports (including module supporting browsers via <script type="module">.
  • vuex.esm-bundler.js
    • For use with bundlers such as webpack, rollup and parcel.
    • Leaves prod/dev branches with process.env.NODE_ENV guards (must be replaced by bundler).
    • Does not ship minified builds (to be done together with the rest of the code after bundling).
  • vuex.cjs.js
    • For use in Node.js server-side rendering with require().

Typings for ComponentCustomProperties

Vuex 4 removes its global typings for this.$store within Vue Component to solve issue #994. When used with TypeScript, you must declare your own module augmentation.

Place the following code in your project to allow this.$store to be typed correctly:

// vuex-shim.d.ts

import { ComponentCustomProperties } from 'vue'
import { Store } from 'vuex'

declare module '@vue/runtime-core' {
  // Declare your own store states.
  interface State {
    count: number
  }

  interface ComponentCustomProperties {
    $store: Store<State>
  }
}

createLogger function is exported from the core module

In Vuex 3, createLogger function was exported from vuex/dist/logger but it's now included in the core package. You should import the function directly from vuex package.

import { createLogger } from 'vuex'

Bug Fixes Included Since 4.0.0-rc.2

4.0.0-rc.2 (2020-11-25)

Bug Fixes

  • fix getters stop working when component is destroyed (#1884) (c3a695e)
  • stop throwing an error on hasModule when parent does not exists (#1850) (f76d72d)

Features

  • build: enable named esm module import on node.js >= 14 (4f4a909)

4.0.0-rc.1 (2020-10-30)

Bug Fixes

Features

  • types: adding logger type for logger plugin (#1853) (cb3198d)

3.5.1 (2020-06-29)

4.0.0-beta.4 (2020-06-29)

Bug Fixes

  • types: add missing logger.d.ts file to the package (#1789) (a477334)
  • warn when unregistering non existing module (#1786) (7cec79d)

3.5.0 (2020-06-29)

4.0.0-beta.3 (2020-06-29)

Bug Fixes

Features

  • include createLogger function in core export (afa566d)
  • include logger plugin to the core export (#1783) (04e2bd8)

3.4.0 (2020-05-11)

4.0.0-beta.2 (2020-05-11)

Bug Fixes

  • types: add useStore function (#1736) #1739
  • build: fix iife build containing process.env.

4.0.0-beta.1 (2020-04-25)

Features

  • Added TypeScript support.

Breaking Changes

Bundles are now aligned with Vue 3

The bundles are generated as below to align with Vue 3 bundles.

  • vuex.global(.prod).js
    • For direct use via <script src="..."> in the browser. Exposes the Vuex global.
    • Note that global builds are not UMD builds. They are built as IIFEs and is only meant for direct use via <script src="...">.
    • Contains hard-coded prod/dev branches, and the prod build is pre-minified. Use the .prod.js files for production.
  • vuex.esm-browser(.prod).js
    • For usage via native ES modules imports (in browser via <script type="module">.
  • vuex.esm-bundler.js
    • For use with bundlers like webpack, rollup and parcel.
    • Leaves prod/dev branches with process.env.NODE_ENV guards (must be replaced by bundler).
    • Does not ship minified builds (to be done together with the rest of the code after bundling).
  • vuex.cjs.js
    • For use in Node.js server-side rendering via require().

Typings for ComponentCustomProperties

Vuex 4 removes its global typings for this.$store within Vue Component due to solving issue #994. When using TypeScript, you must provide your own augment declaration.

Please place the following code in your project to have this.$store working.

// vuex-shim.d.ts

declare module "@vue/runtime-core" {
  // Declare your own store states.
  interface State {
    count: number
  }

  interface ComponentCustomProperties {
    $store: Store<State>;
  }
}

4.0.0-alpha.1 (2020-03-15)

This is the Vue 3 compatible version of Vuex. The focus is compatibility, and it provides the exact same API as Vuex 3, so users can reuse their existing Vuex code for Vue 3.

Status: Alpha

All Vuex 3 feature works. There are a few breaking changes described in a later section, so please check them out. You can find basic usage with both option and composition API at example folder.

Please note that it's still unstable, and there might be bugs. Please provide us feedback if you find anything. You may use vue-next-webpack-preview to test out Vue 3 with Vuex 4.

Breaking changes

Installation process has changed

To align with the new Vue 3 initialization process, the installation process of Vuex has changed as well.

You should use a new createStore function to create a new store instance.

import { createStore } from 'vuex'

const store = createStore({
  state () {
    return {
      count: 1
    }
  }
})

This is technically not a breaking change because you could still use new Store(...) syntax. However, to align with Vue 3 and also with Vue Router Next, we recommend users to use createStore function instead.

Then to install Vuex to Vue app instance, pass the store instance instead of Vuex.

import { createApp } from 'vue'
import store from './store'
import App from './APP.vue'

const app = createApp(Counter)

app.use(store)

app.mount('#app')

Kown issues

  • The code is kept as close to Vuex 3 code base as possible, and there're plenty of places where we should refactor. However, we are waiting for all of the test cases to pass before doing so (some tests require Vue 3 update).
  • TypeScript support is not ready yet. Please use JS environment to test this for now.

3.4.0 (2020-05-11)

Features

3.3.0 (2020-04-25)

Bug Fixes

Features

  • Add prepend option for subscribe and subscribeAction (#1358) (a39d076)
  • logger: createLogger can optionally log actions (#987) (18be128)

3.2.0 (2020-04-19)

Features

3.1.3 (2020-03-09)

Bug Fixes

  • Prevent invalidating subscription iterator (#1438) (e012653)

3.1.2 (2019-11-10)

Bug Fixes

  • tweak mapping helper warning message (#1641) (e60bc76)
  • types: avoid broadening vue instance type when using map helpers (#1639) (9a96720)
  • add warnings when the different namespaced modules has the same names… (#1554) (91f3e69)
  • Should vuex mapState print error message #1093 (#1297) (e5ca2d5)
  • Warn about conflicts between state and module (#1365) (538ee58)
  • docs: Clearify state object type (#1601) (de06f76)

Performance Improvements

  • Implementing a cache for the gettersProxy object creation (#1546) (4003382)

3.1.1 (2019-05-08)

Bug Fixes

Features

  • devtool: allow usage in non-browser environments (#1404) (665455f)
  • esm build: build ES modules for browser (#1533) (d7c7f98)

3.1.0 (2019-01-17)

Bug Fixes

Features

  • add ability to turn off devtools on vuex by passing an off options (#1407) (be75d41)
  • ensure errors in action subscribers do not break actions (acd7249)

Reverts

3.0.1 (2017-11-01)

3.0.0 (2017-10-11)

Features

  • typings: adapt to the new Vue typings (#909) (65dbfec)

BREAKING CHANGES

  • typings: It is no longer compatible with the old Vue typings

  • chore(package): bump typescript and vue core typings

  • chore: bump vue

  • Update package.json

2.5.0 (2017-10-11)

Bug Fixes

  • initialize root state as an empty object if state function returns no value (#927) (0e9756b)

Features

2.4.1 (2017-09-27)

Bug Fixes

  • allow installation on extended Vue copies (c87b72f)
  • link to details of mutations in components (#930) (e82782b)
  • move auto installation code into the store constructor (#914) (852ac43)

Features

  • allow to passing functions in mapActions/mapMutations (fix #750) (#924) (be15f32)

2.4.0 (2017-08-29)

Bug Fixes

  • typings: watch() returns an unwatch function (#922) (a4bd081)
  • add missing typings and docs of createNamespacedHelpers (#910) (7ad573b)

Features

  • store: bind mutation and action handlers to store (#872) (67da622)

Performance Improvements

  • do not connect devtools if Vue.config.devtools == false (#881) (dd7f817)

2.3.0 (2017-04-13)

BREAKING CHANGES

  • It's no longer allowed to omit the '-loader' suffix when using loaders. You need to specify 'babel-loader' instead of 'babel'. My version of webpack: 2.2.0-rc.3 Adding the '-loader' suffix fixed the problem. Not sure though how safe it is to use 'babel-loader' instead of 'babel' with previous webpack versions...

2.2.1 (2017-02-26)

2.2.0 (2017-02-26)

2.1.2 (2017-02-06)

Reverts

2.1.1 (2016-12-17)

2.1.0 (2016-12-16)

2.0.0 (2016-09-30)

2.0.0-rc.6 (2016-09-24)

2.0.0-rc.5 (2016-08-15)

2.0.0-rc.4 (2016-08-05)

2.0.0-rc.3 (2016-07-11)

2.0.0-rc.1 (2016-07-05)

1.0.0-rc (2016-07-01)

0.8.2 (2016-06-28)

0.8.1 (2016-06-28)

0.8.0 (2016-06-23)

0.7.1 (2016-06-22)

0.7.0 (2016-06-21)

0.6.3 (2016-04-23)

0.6.2 (2016-03-08)

0.6.1 (2016-03-07)

0.6.0 (2016-03-07)

0.5.1 (2016-03-04)

0.5.0 (2016-03-04)

0.4.2 (2016-03-02)

0.4.1 (2016-03-01)

0.4.0 (2016-03-01)

0.3.0 (2016-02-16)

Bug Fixes