title: Setup abstract, real time resolvable Vuex store implemented in another module?
body: <p>I have two modules, let's call them <code>core</code> and <code>implementation</code>. How can I set up the store to enable things in <code>core</code> to rely on an <em>assumed</em> store provided by the <code>implementation</code>? </p>
  
  <p>In the <code>implementation</code>'s store I am doing something like this:</p>
  
  <pre><code>import Core from 'core'
  
  export default new Vuex.Store(
      new Core().defaultStore
  )
  </code></pre>
  
  <p>That will register default state, mutations, actions and getters (the setup allows the user of <code>implementation</code> to extend/modify a default store provided by <code>core</code>).</p>
  
  <p>The problem arises in an action inside <code>core</code> when it tries to access a getter in a non vue JS file.</p>
  
  <pre><code>export default class SomeClassInCore {
      exampleMethod() {
          // The getters will not be accessible here!
          return store.getters.someKey
      }
  }
  </code></pre>
  
  <p>Is there some way to achieve "runtime" resolving of the "master" store? I was thinking about if I somehow can use <code>window</code> to access the Vue instance created by the <code>implementation</code> repo?</p>
  
  <p>I tried doing it like this</p>
  
  <pre><code>import store from './store.js'
  import Vue from 'vue'
  import { CoreVueTools } from 'core'
  
  window.Vue = Vue
  window.store = store
  
  Vue.use(CoreVueTools)
  
  new Vue({
      el: '#app',
      store
  })
  </code></pre>
  
  <p>And then accessing it like this</p>
  
  <pre><code>exampleMethod() {
      return window.store.getters.someKey
  }
  </code></pre>
  
  <p>That works, but I'm not super happy about this solution, there has to be a better way than relying on window right? Can I use another design pattern?</p>