Typescript: Can't access injected plugin with vuex-module-decorators

[fy0]

Describe the bug
Can't access this.$myplugin inside vuex-module-decorators's Action.
Also can't get appContext or store.

https://nuxtjs.org/guide/plugins/#combined-inject

To Reproduce
plugin:

import { createAPIRequester } from '../api/main'
import { Context } from '@nuxt/types'

declare module 'vue/types/vue' {
  interface Vue {
    $api: any
  }
}

declare module 'vuex/types/index' {
  interface Store<S> {
    $api: any
  }
}

export default (ctx: Context, inject: any) => {
  const api = createAPIRequester(ctx)
  inject('api', api)
}

store:

import { Module, VuexModule, Mutation, Action } from 'vuex-module-decorators'

@Module({
  stateFactory: true,
  namespaced: true,
  name: 'test'
})
export default class TestModule extends VuexModule {
  a = 1

  @Action
  test () {
    console.log(111, this.$api)
  }
}

[kevinmarrec]

@fy0 It's a vuex-module-decorators issue and related to how it's implemented, there's nothing we can do around Nuxt TypeScript support, sorry.

Please open or look for new issue on their repository.

[fy0]

@kevinmarrec Vue plugin not inject to vuex, only nuxt did it. so it's not a problem to vuex-module-decorators.
And vuex-module-decorators is recommended by nuxt-typescript's document.

[fy0]

Is store-accessor works for this case?

[fy0]

Solved in another way

[bbflame]

@fy0 How did you resolve it case?

[fy0]

@bbflame

@fy0 How did you resolve it case?

Just save the instance of plugin.

import { createAPIRequester, APIInterface } from '../api'
import { Context } from '@nuxt/types'

let $api: APIInterface

declare module 'vue/types/vue' {
  interface Vue {
    $api: APIInterface
  }
}

declare module 'vuex/types/index' {
  interface Store<S> {
    $api: APIInterface
  }
}

export default (ctx: Context, inject: any) => {
  const api = createAPIRequester(ctx)
  $api = api
  inject('api', api)
}

export { $api }

Then, import at store file:

import { $api } from '../plugins/api'