Vuex-module-decorators: Dynamic modules duplicates (registered multiple times)

Created on 29 May 2019  路  11Comments  路  Source: championswimmer/vuex-module-decorators

Hi,

I'm using dynamic modules in a very standard way and sometimes i get the following error:
[vuex] duplicate getter key: namespace/getter

Which means that registerModule is being called even though the module has already been registered.

I wanted to implement what is suggested in this issue but I believe this has to be done inside of vuex-module-decorators since it handles the registering automatically.

Most helpful comment

Any elaboration on this? Still having the same problem, makes hot reloading a rather cumbersome, even annoying feature..

All 11 comments

I faced the same problem :(

I got around this by using store.unregisterModule before registering the module.

I actually figured out what happens :

In development when you modify your vuex module the hot reload has to register it again in order to apply changes.
Which means in production it won't happen.

yeh it would be nice if it checked before adding more versions of the same module, maybe a unique flag? is there a use case where someone would want to add multiple instances of the same module?

Well if I understand correctly you have to register it again otherwise your changes won't be applied, so if you have multiple instances of your same module just reload the page.
Otherwise yes it should probably unregister the old version before registering the new, but it is a pretty minor issue in my opinion.

Yeh so it should replace the module upon creation. And it does present a lot of problems if you have newer/older versions of the module running at once during development. If you rely on hot reload this is unusable without the fix.

I got around this by using store.unregisterModule before registering the module.

Did you unregister before getModule?

Something like this, though I'm not sure if it works 100% of the time.

const name = 'module'

if (store.state[name]) {
  store.unregisterModule(name)
}

@Module({
  dynamic: true,
  name,
  namespaced: true,
  store
})
export class Module extends VuexModule {}

export const moduleInstance = getModule(Module, store)

Any elaboration on this? Still having the same problem, makes hot reloading a rather cumbersome, even annoying feature..

Would this be a difficult fix?

Something like this, though I'm not sure if it works 100% of the time.

const name = 'module'

if (store.state[name]) {
  store.unregisterModule(name)
}

@Module({
  dynamic: true,
  name,
  namespaced: true,
  store
})
export class Module extends VuexModule {}

export const moduleInstance = getModule(Module, store)

Will this overwrite modules with SSR?

Was this page helpful?
0 / 5 - 0 ratings

Related issues

tuvokki picture tuvokki  路  7Comments

Akumzy picture Akumzy  路  5Comments

Leandro-Albano picture Leandro-Albano  路  3Comments

souphuhn picture souphuhn  路  5Comments

garyo picture garyo  路  5Comments