How do I break up my vuex file?

Question

I have a vuex file with a growing mass of mutators, but I\'m not sure of the correct way of splitting it out into different files.

Because I have:

cons

Answer 1

i have this structure:

└── store
          └─ module1
              ├── actions.js
              ├── mutations.js
              ├── getters.js
              └── index.js
   index.js 

and you can copy this example code : index.js from module1

    import actions from "./actions";
    import getters from "./getters";
    import mutations from "./mutations";
    
    import { state } from "./state";

    export default {
     state: () => state,
     actions,
     mutations,
     getters,
   };

state:

export let state = {
  themes: [],
};

getters:

const themesList = (state) => {
  return state.themes;
};

actions:

const getThemesList = async ({ commit }) => {
  
  commit(types.GET_THEMES, [values]);
};

mutations:

const GET_THEMES = (state, themes) => {
  state.themes = themes;
};

and in the main index.js in store put this

const createStore = () => {
  return new Vuex.Store({
    modules: {
      module1: module1,
    },
  });
};

export default createStore;