Accessing one static module from another, without circular imports?

I’m using static modules (using the method in #178), see test repo at https://github.com/garyo/vuex-problem-test.git. I have this layout:

src
├── App.vue
├── main.ts
└── store
    ├── index.ts
    ├── modules
    │   ├── modB.ts
    │   └── user.ts
    └── store-accessor.ts

i.e. two modules, a store-accessor which imports those and exports the stores, and store/index.ts which imports store-accessor and exports all the stores.

This is all OK, until modB.ts needs to use some state from user.ts. I add import { userStore } from '@/store' to `modB.ts, which creates an import cycle: store/index.ts -> store/store-accessor.ts -> store/modules/modB.ts -> store/index.ts Is there any way around that?

[garyo]

By the way I renamed my test repo above to https://github.com/garyo/vuex-module-decorators-example – since it’s an example, not a problem anymore!

[garyo]

If you only need to access the other module’s state (not getters or actions or mutations), this works: In the module modB that needs to use the other module, do this:

import userModule from '@/store/modules/user'
...
get usingUserMod() {
    const userStore = this.context.rootState.user as userModule
    const uid = userStore.uid
   // now use uid as usual
}

It works because it uses the dynamic context in the method rather than trying to get the root store when the module is loaded.

But that cast isn’t really correct; userStore is not really a userModule. So if you try to call any of its methods or use any of its getters, they will fail at runtime (“userStore.setUid is not a function”).

Any hints?