расширить магазин Vuex в другой магазин Vuex (typescript/nuxtjs)

Question

Я понимаю, что могу импортировать геттеры из другого класса вот так:

class Items<T> {
  items: T[] = [{
      id: 1,
      name: 'My 1st network campaign',
      searchListId: 1,
      messageId: 1,
      isActive: true,
      createdAt: Date.now()
    }]

  get list(): T[] {
    return this.items
  }

  get find(): Function {
    return (id: number): T => {
      return this.items[id]
    }
  }

}

declare interface Campaign {
  id?: number
  name: string
  searchListId: number
  messageId: number
  isActive: boolean
  createdAt?: number | Date
}


class Campaigns extends Items<Campaign> {

}

let campaign = new Campaigns()

console.log(campaign.find(0))

Смотрите его работы здесь: https://www.typescriptlang.org/play/index.html?experimentalDecorators=true&ssl=1&ssc=1&pln=39&pc=30#code/MYGwhgzhAECSAuBTAthAPAFQHzQN4ChpoBLJVALmgwG0BdaAXmmoKLZIBNKBGAGkPbQAdmGSJKAcgCyAT2jcI8YYngB3APYAnANbRgogA5hiAcyET+g6BERhNwABYAZYothd5lwWKhgTidx4vdlcAQWB4YgA3cWh4TQBXRGC2YE1bJA5Q+EoAETAkADohdVUACgBKASIAX1p8AX8lEFd4SsoaelY2dPgEzSE4h1dC0hQIARqGoiboADNiIQ526AAxBKEI4nVB7qJe-sGy4g8hBOQAI0RNCo7GHD2elUOhkbHUahP69inahqn8BxEKA7IgSEIkJo5mBgGCAMKGYxmPACE4AfkoZ0u1wEIjElEUmkWJgENjsjhcblO5yumgEPggfgC1OxdKIYS2MUoF3U6hAtiEAjSGUQWXgGOENOu0AAPtB8kh8AD8CCoNAEcgjKYhDBEAAPJBLGAIcZoDVaswPf4NflKfSapGDJhCRCqdWI7UQSoNYA7CB8xCFEDqExle0WoSFBZLMoABgqFSAA

Однако, если сделать то же самое с моими хранилищами NuxtJS, это не работает, и я получаю следующую ошибку

unknown getter: campaigns/list

Вот соответствующий код:

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

declare abstract class ItemsService<T> {
  abstract lists: { [key: number]: T }

  public abstract getAll(): Promise<T[]>

  public abstract getById(id: number): Promise<T>

  public abstract create(item: T): Promise<T>

  public abstract update(item: T): Promise<T>

  public abstract delete(id: number): Promise<never>
}

declare interface Campaign {
  id?: number
  name: string
  searchListId: number
  messageId: number
  isActive: boolean
  createdAt?: number | Date
}

class CampaignsService implements ItemsService<Campaign> {
  lists: { [key: number]: Campaign } = {
    1: {
      id: 1,
      name: 'My 1st network campaign',
      searchListId: 1,
      messageId: 1,
      isActive: true,
      createdAt: Date.now()
    },
    2: {
      id: 2,
      name: 'My 2nd network campaign',
      searchListId: 2,
      messageId: 2,
      isActive: true,
      createdAt: Date.now()
    },
    3: {
      id: 3,
      name: 'My 3rd network campaign',
      searchListId: 2,
      messageId: 2,
      isActive: true,
      createdAt: Date.now()
    },
    4: {
      id: 4,
      name: 'My 4th network campaign',
      searchListId: 3,
      messageId: 3,
      isActive: true,
      createdAt: Date.now()
    }
  }

  public getAll(): Promise<Campaign[]> {
    return new Promise((resolve) => {
      resolve(Object.values(this.lists))
    })
  }

  public getById(id: number): Promise<Campaign> {
    return new Promise((resolve) => {
      resolve(this.lists[id])
    })
  }

  public create(item: Campaign): Promise<Campaign> {
    return new Promise((resolve) => {
      const id = Date.now()
      this.lists[id] = { id, ...item }
      resolve(this.lists[id])
    })
  }

  public update(item: Campaign): Promise<Campaign> {
    return new Promise((resolve) => {
      this.lists[item.id as number] = { ...item }
      resolve(this.lists[item.id as number])
    })
  }

  public delete(id: number): Promise<never> {
    return new Promise((resolve) => {
      delete this.lists[id]
      resolve()
    })
  }
}

class Items<T> extends VuexModule {
  items: T[] = []

  get list(): T[] {
    return this.items
  }

  get find(): Function {
    return (id: number): T => {
      return this.items[id]
    }
  }

  get itemService(): ItemsService<T> {
    throw new Error('"get itemService(): ItemsService<T>" not implemented')
  }

  @Action({ rawError: true })
  async load() {
    return this.itemService
      .getAll()
      .then((items) => this.context.commit('updateItems', items))
  }

}

@Module({
  stateFactory: true,
  namespaced: true
})
class Campaigns extends Items<Campaign> {

  get itemService(): ItemsService<Campaign> {
    return CampaignService
  }
}

И в моем компоненте

import Vue from 'vue'
import { mapActions, mapGetters } from 'vuex'

export default Vue.extend({
  layout: 'app',
  data() {
    return {
      loading: true
    }
  },
  computed: {
    ...mapGetters('campaigns', { campaigns: 'list' })
  },
  created() {
    Promise.resolve()
      .then(() => new Promise((resolve) => setTimeout(resolve, 1300)))
      .then(() => this.loadCampaigns())
      .then(() => (this.loading = false))
  },
  methods: {
    ...mapActions('campaigns', { loadCampaigns: 'load' }),
  }
})

Если я добавлю get list(): Campaign[] { return this.items } к моему class Campaigns, он отображает список кампаний.
Я так понимаю, это как-то импортирует действие изclass Items<T>но не получатели.
Как мне поступить?