Installing and Setting Up Vuex

If you did not install Vuex as an option when initializing your project with Vue CLI 3, don’t worry, you’re still able to install and use it. Just install the package via NPM or Yarn.

$ npm install vuex --save
# or
$ yarn add vuex

Let’s create a new file called store.js in your project’s src directory. This file will contain your Vuex store. Your store contains your application’s state (data), it’s actions (run logic and call a mutation), mutations (actually changes the data), getters, and setters.

For your store.js, you will need to import both Vue and Vuex.

store.js

import vue from 'vue';
import vuex from 'vuex';

Next, you need to tell Vue.js to use Vuex as your state management library in your application.

store.js

Vue.use(Vuex);

After that, you need to set up and export a basic store that contains state, actions, and mutations.

store.js

export default new Vuex.Store({
  state: {

  },...