Свойство ‘$store’ не существует для типа ‘ComponentPublicInstance’, использующего Vuex 4 с typescript

#typescript #vue.js #visual-studio-code #vuex

#typescript #vue.js #visual-studio-code #vuex

Вопрос:

У меня есть проект, в котором я использую typescript и vue с vuex, у меня возникает эта ошибка в VSCode:

 Property '$store' does not exist on type 'ComponentPublicInstance<{}, {}, {}, { errors(): any; }, { eliminarError(error: string): void; }, EmitsOptions, {}, {}, false, ComponentOptionsBase<{}, {}, {}, { errors(): any; }, { eliminarError(error: string): void; }, ... 4 more ..., {}>>'
 

Я прочитал документацию, и там говорится, что я должен добавить общий файл.ts с этим содержимым:

 // vuex.d.ts
import { ComponentCustomProperties } from 'vue'
import { Store } from 'vuex'

declare module '@vue/runtime-core' {
  // declare your own store states
  interface State {
    count: number
  }

  // provide typings for `this.$store`
  interface ComponentCustomProperties {
    $store: Store<State>
  }
}
 

Но затем VSCode жалуется 'ComponentCustomProperties' is defined but never used , и он по-прежнему показывает первую ошибку, о которой я упоминал

Как я могу решить эту проблему?

Ответ №1:

Я также столкнулся с этой ошибкой в VSCode, и она была устранена.

 // vuex.d.ts
import { ComponentCustomProperties } from 'vue'
import { Store } from 'vuex'

declare module '@vue/runtime-core' {
  // declare your own store states
  interface State {
    count: number
  }

  // provide typings for `this.$store`
  interface ComponentCustomProperties {
    $store: Store<State>
  }
} 

Конфигурация в соответствии с официальным документом не вступила в силу. После перезапуска VSCode оно, наконец, вступило в силу.

Ответ №2:

добавить /* eslint-disable */ в начало файла shims-vuex.d.ts