Snyk has created this PR to upgrade vuex from 3.6.2 to 4.0.1.
:information_source: Keep your dependencies up-to-date. This makes it easier to fix existing vulnerabilities and to more quickly identify and fix newly disclosed vulnerabilities when they affect your project.
Warning: This is a major version upgrade, and may be a breaking change.
The recommended version is 9 versions ahead of your current version.
The recommended version was released 8 months ago, on 2021-05-24.
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!
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 4.
To install Vuex to a Vue instance, pass the store instance instead of Vuex.
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.tsimport{ComponentCustomProperties}from'vue'import{Store}from'vuex'declare module '@ vue/runtime-core'{// Declare your own store states.interfaceState{count: number}interfaceComponentCustomProperties{$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.
Snyk has created this PR to upgrade vuex from 3.6.2 to 4.0.1.
:information_source: Keep your dependencies up-to-date. This makes it easier to fix existing vulnerabilities and to more quickly identify and fix newly disclosed vulnerabilities when they affect your project.
Warning: This is a major version upgrade, and may be a breaking change.
Release notes
Package name: vuex
Features
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 removenext
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.To install Vuex to a Vue instance, pass the store instance instead of Vuex.
Bundles are now aligned with Vue 3
The following bundles are generated to align with Vue 3 bundles:
vuex.global(.prod).js
<script src="...">
in the browser. Exposes the Vuex global.<script src="...">
..prod.js
files for production.vuex.esm-browser(.prod).js
<script type="module">
.vuex.esm-bundler.js
webpack
,rollup
andparcel
.process.env.NODE_ENV
guards (must be replaced by bundler).vuex.cjs.js
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:createLogger
function is exported from the core moduleIn Vuex 3,
createLogger
function was exported fromvuex/dist/logger
but it's now included in the core package. You should import the function directly fromvuex
package.Bug Fixes Included Since 4.0.0-rc.2
storeKey
(4ab2947)Bug Fixes
hasModule
when parent does not exists (#1850) (f76d72d)Features
Bug Fixes
Features
Bug Fixes
logger.d.ts
file to the package (#1789) (a477334)Bug Fixes
process.env
flag (#1749) (0fea8c4)Features
createLogger
function in core export (afa566d)Bug Fixes
Note: You are seeing this because you or someone else with access to this repository has authorized Snyk to open upgrade PRs.
For more information:![](https://api.segment.io/v1/pixel/track?data=eyJ3cml0ZUtleSI6InJyWmxZcEdHY2RyTHZsb0lYd0dUcVg4WkFRTnNCOUEwIiwiYW5vbnltb3VzSWQiOiIyZWJkMjg5MC1lN2U1LTQ1NjQtODhhMS05MmZkNThiN2UxMDkiLCJldmVudCI6IlBSIHZpZXdlZCIsInByb3BlcnRpZXMiOnsicHJJZCI6IjJlYmQyODkwLWU3ZTUtNDU2NC04OGExLTkyZmQ1OGI3ZTEwOSJ9fQ==)
![](https://app.snyk.io/badges/merge-advice/?package_manager=npm&package_name=vuex&from_version=3.6.2&to_version=4.0.1&pr_id=2ebd2890-e7e5-4564-88a1-92fd58b7e109&visibility=false&has_feature_flag=false)
🧐 View latest project report
🛠 Adjust upgrade PR settings
🔕 Ignore this dependency or unsubscribe from future upgrade PRs