Vue js 3 - 类型“CreateComponentPublicInstance<、、、、 上不存在属性“项目”，

Posted 2023-02-22

【中文标题】Vue js 3 - 类型“CreateComponentPublicInstance<、、、、 上不存在属性“项目”，

【英文标题】：Vue js 3 - Property 'projects' does not exist on type 'CreateComponentPublicInstance<, , , , ,Vue js 3 - 类型“CreateComponentPublicInstance<、、、、 上不存在属性“项目”，

【发布时间】：2021-09-08 15:04:55

【问题描述】：

问题：

Property 'projects' does not exist on type 'CreateComponentPublicInstance<, , , , , ComponentOptionsMixin, ComponentOptionsMixin, EmitsOptions, , , false, OptionTypesType<, ... 4 more ..., >, ... 5 more ..., >'

由于某种原因它在计算时尖叫，你可以看到我的 this.project 或 this.message。

我不知道如何解决它，请帮助。 包.json

 "devDependencies": 
    "@typescript-eslint/eslint-plugin": "^4.18.0",
    "@typescript-eslint/parser": "^4.18.0",
    "@vue/cli-plugin-eslint": "~4.5.0",
    "@vue/cli-plugin-router": "~4.5.0",
    "@vue/cli-plugin-typescript": "~4.5.0",
    "@vue/cli-plugin-vuex": "~4.5.0",
    "@vue/cli-service": "~4.5.0",
    "@vue/compiler-sfc": "^3.0.0",
    "@vue/eslint-config-prettier": "^6.0.0",
    "@vue/eslint-config-typescript": "^7.0.0",
    "eslint": "^6.7.2",
    "eslint-plugin-prettier": "^3.3.1",
    "eslint-plugin-vue": "^7.0.0",
    "cross-env": "^7.0.3",
    "css-loader": "^5.2.6",
    "fork-ts-checker-webpack-plugin": "^6.2.10",
    "less": "^3.0.4",
    "less-loader": "^5.0.0",
    "sass-loader": "10.1.1",
    "terser-webpack-plugin": "^4.2.3",
    "prettier": "^2.2.1",
    "typescript": "~4.1.5"
  

问题出在我添加到 shims-vue.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>
  

然后它显示我的错误。 如果我删除 store 声明，它会在 store 上尖叫，而不是在计算上。

【问题讨论】：

你用definedComponent导出组件了吗？可以分享整个文件吗？

我已经更新了我的问题。

如果你将删除声明模块'@vue/runtime-core'，它会工作，但它会在商店里尖叫而不是计算

问题已解决

我已将代码添加到 shims-vue.d.ts

【参考方案1】：

我在计算属性上遇到了类似的 Vetur 错误问题，搜索提出了这个问题。

根据这个链接，这是一个关于 Vue 的 Typings 和 Typescript 的已知问题。

https://vuejs.github.io/vetur/guide/FAQ.html#property-xxx-does-not-exist-on-type-combinedvueinstance

将计算属性更改为具有显式返回类型似乎可以解决问题。

greet (): string 
  return this.msg + ' world'

更多细节和例子：

https://vuejs.org/v2/guide/typescript.html#Annotating-Return-Types

【参考方案2】：

我已经添加了

import  ComponentCustomProperties  from "vue";
import  Store  from "vuex";

declare module "@vue/runtime-core" 
  interface ComponentCustomProperties 
    $store: Store<State>;
  

到 vuex-shim.d.ts，问题就解决了。