title: vuex-class: accessing Vuex outside of a Vue component
body: <p>How can I get access to Vuex outside of a Vue component with vuex-class?</p>
  
  <p>In normal situation it is pretty simple:</p>
  
  <pre><code>// some JS file
  import store from './../store'; // path to Vuex store
  
  store.commit('ux/mutationName', somePayload)
  </code></pre>
  
  <p>But I am using vuex-class and I have Vuex module:</p>
  
  <pre><code>import { Module } from 'vuex';
  import { RootState } from '@/types/vuex/types';
  import { MutationTree } from 'vuex';
  import { GetterTree } from 'vuex';
  
  const namespaced: boolean = true;
  
  export interface UXState {
    compLoading: boolean;
  }
  
  export const state: UXState = {
    compLoading: false
  };
  
  export const mutations: MutationTree&lt;UXState&gt; = {
    setCompLoading(state, payload: boolean): void {
      state.compLoading = payload;
    }
  };
  
  export const getters: GetterTree&lt;UXState, RootState&gt; = {
    compLoading(state): boolean {
      return state.compLoading;
    }
  };
  
  export const ux: Module&lt;UXState, RootState&gt; = {
    namespaced,
    state,
    mutations,
    getters
  };
  </code></pre>
  
  <p>Fom Vue component I have access to store Mutations in this way:</p>
  
  <pre><code>&lt;script lang="ts"&gt;
    import axios from 'axios';
    import {Component, Vue} from 'vue-property-decorator';
    import {Mutation} from "vuex-class";
    const namespace: string = "ux";
  
    @Component({
      name: 'CompName'
    })
    export default class AppNavigationBar extends Vue {
  
      @Mutation('setCompLoading', { namespace })
      setCompLoading!: (flag: boolean) =&gt; void;
  
      async created() {
        this.setCompLoading(true);
        const resp = await axios.get('someURL');
        this.setCompLoading(false);
      }
    }
  &lt;/script&gt;
  </code></pre>
  
  <p>How can I get access to Mutation using vuex-class with TS outside of a Vue component?</p>