Vue js 3 - 属性 'projects' 在类型 'CreateComponentPublicInstance<{}, {}, {}, {}, {},

Question

问题：

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

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

我不知道如何解决它，请帮忙。 package.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>
  }
}

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

Answer 1

我已经添加了

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

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

到 vuex-shim.d.ts 问题已解决。

Answer 2

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

根据此 link，这是一个关于 Vue 的类型和 Typescript 的已知问题。

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

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

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

更多详细信息和示例：

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

Answer 3

这个错误让我浪费了很多时间，在我的例子中也与 vue 的 ''data'' 属性有关。首先我在节点模块上遇到了一些问题，在卸载全局、本地并重新安装包后，我注意到空白项目（由 vue-cli 创建）现在可以工作，只有我的主项目一直报告此错误。

我的项目现在的问题是只有全局注册的组件没有被 vetur 或 volar 正确识别，所以我一直只在它们上收到此线程的错误。

我最终偶然发现了一个解决方案，我会保留它直到我找出真正发生的事情。 在全局组件中，打字稿仅在我这样声明“数据”时才停止返回此错误:

data: () => {

其他变体，例如这个，不起作用

    //data() { also not works
    data: function () {
        return {
            comida: 1,
        }
    },
    methods: {
        setupVisitsCategoryCard() {
            this.comida = 2 //Property 'comida' does not exist on type 'CreateComponentPublicInstance<...'
        }
    }
    ```

Vue js 3 - 属性 'projects' 在类型 'CreateComponentPublicInstance<{}, {}, {}, {}, {},

Vue js 3 - Property 'projects' does not exist on type 'CreateComponentPublicInstance<{}, {}, {}, {}, {},

typescript

eslint

vue.js