Issue updating major release

[HDShabe]

Hi,

Regarding the other issue raised https://github.com/balmjs/balm-ui/issues/128

It seems that I can only update from 9.42.1 to at most 10.0.0.

If I go any past 10.0.0 (10.0.1 and above up to 10.4.0) I get the following issue when error on my front end:

Uncaught (in promise) TypeError: Cannot use 'in' operator to search for 'myVuexGetter' in undefined
    at Proxy.mappedGetter (vuex.esm-bundler.js:1239:56)
    at ReactiveEffect.run (reactivity.esm-bundler.js:160:29)
    at ComputedRefImpl.get value [as value] (reactivity.esm-bundler.js:1090:39)
    at Object.get [as userManagerConfiguration] (runtime-core.esm-bundler.js:2148:30)
    at Object.get (runtime-core.esm-bundler.js:6008:24)
    at Proxy.created (myPage.vue:23:47)
    at callWithErrorHandling (runtime-core.esm-bundler.js:6737:36)
    at callWithAsyncErrorHandling (runtime-core.esm-bundler.js:6746:21)
    at callHook (runtime-core.esm-bundler.js:2268:5)
    at applyOptions (runtime-core.esm-bundler.js:2170:9)

This happens whenever my Vue app uses Vuex to map some getters from my store, things that worked before are just null.

This is the only package i've updated, though when I tried 10.4.0 I update all of my packages for any conflicting updates.

I've had a look through the breaking changes and there's only 2 controls that have changed, none of which would break here.

Originally I only tried to update to fix the other issue linked above, but thought it was worth raising.

Let me know again if you need any more information.

Thanks!

[elf-mouse]

What is myVuexGetter? Could you provide a demo! Or, you may need to debug carefully

[HDShabe]

myVuexGetter is a getter from the vuex store

//my vue page

 import { mapGetters } from 'vuex';

 computed: {
            ...mapGetters(['myVuexGetter']),
        }

 async created() {
            if (!this.myVuexGetter){//stuff}
}

//my vuex store

getters: {
        myVuexGetter: state => {
            if (state.otherStoreValue) {
                return true;
            }

            return false;
        },
    },

When I'm on version 10.0.0 this works fine. When I update to >= 10.0.1 I get the above error.

The offending code inside of my vuex getter is just trying to access things from my store but they're all null on version 10.0.1 and above.

I appreciate this isn't a lot of information, if there's nothing that springs to mind for you with this, I'll go away and try and prepare a demo I can share with you when I've got a little more time.

[elf-mouse]

Ha, because the global $store naming conflict.

BalmUI has a built-in $store, if you need to use Vuex.$store at the same time, you need config like this:

• /path/to/app/scripts/store/index.js

  import useDemoStore from './modules/demo';
  
  export default {
  name: 'myStore', // Set new custom store name (all lowercase): `$mystore` (Defaults: `$store`)
  ...useDemoStore()
  };

• /path/to/app/scripts/main.js

  import BalmUI from 'balm-ui';
  import myStore from './store';
  
  // `app`: Vue app
  app.use(BalmUI, {
  $store: myStore
  });

This part of the document is not reflected for the time being, I will update the subsequent

Thanks @HDShabe

[elf-mouse]

Hi @HDShabe ,

BalmUI does not enable the built-in $store by default in v10.4.1, you can try it again :)

Thanks again :)

[HDShabe]

Hi @elf-mouse

Looks much better! Thanks for the explanation and also the change for not enabling the built in store.

Cheers!