Avoid conflict between Vuex an IAP plugin in Phonegap app

Question

While developing a Phonegap app I use Vuex to manage app's state. So, I have at App.vue:

// Import store
import store from './vuex/store'

Later I want to create an annual subscription, for which I use the cordova-plugin-purchase plugin (https://github.com/j3k0/cordova-plugin-purchase), which exports a global object called 'store'.

So when I try to use the 'register' method of this plugin I get an error saying that there is no 'register' method for Vuex:

store.register()

"TypeError: _vuex_store__WEBPACK_IMPORTED_MODULE_0__["default"].register is not a function."

How can I avoid this conflict provided that this is the most updated and viable plugin to create IAP for Cordova projects?

Here is my code:

At app.js:

// Init App
new Vue({
  el: '#app',
  template: '<app/>',

  // Register App Component
  components: {
    app: App
  }
});

At App.vue:

// Import store
    import store from './vuex/store'

    export default {
        store,
        data() {
            return {...

At Login.vue:

if (response.data.result === 'OK') {

                            this.$store.dispatch('setUserID', response.data.user._id);
                            this.$store.dispatch('setUserEmail', response.data.user.email);
                            this.$store.dispatch('setUserName', response.data.user.name); ...

Later in component to set the IAP:

<script>
import store from "../vuex/store";
...
mounted() {
    // Register the product
    store.register([ // being referred here to IAP global store object
      {
        id: ...

I should add that I'm using Framework7 + Vue + Webpack

Answer 1

Try this:

import vuexstore from './vuex/store';

// Main
new Vue({
  store: vuexstore,
  render: h => h(App)
}).$mount("#app");

Use it in components as this.$store as usual

Do you have a reason to import the Vuex store in the IAP component? There shouldn't be, since vuex would be accessible through this.$store.

Try not importing the Vuex store in that component and simply logging the other global object however you would use it. Right now it doesn't appear that you import or use the non-Vuex store anywhere.