如何修复VSCode中的“ CombinedVueInstance类型上不存在属性XX”错误？ （带有Typescript的文字）

Question

在编辑Vue Typescript文件时，VS Code报告很多问题/红线：

示例错误：

[ts] Property 'isLoading' does not exist on type 'CombinedVueInstance<Vue, 
object, > object, object, Readonly<Record<never, any>>>'. [2339]

当我在“ this”上引用一个属性时，问题似乎就出现了，并且所有此类引用在编辑器中都有一条红线，指出上述错误的变体。对于Vue数据对象中定义的属性和方法中定义的函数，问题都是相同的。

现在，有两个有趣的方面：​​

1. 直到今天我对这些文件都没有问题。昨天，在关闭之前，一切都按预期进行。今天重新开始，我遇到了这个问题。
2. 代码会编译并运行。如果我使用tsc构建文件，它们将很好地编译-并且应用程序将按预期部署并正常工作。

有关我的设置的信息：

• npm视图打字稿版本为我提供3.2.4版本
• Vue处于2.5.22
• VS代码为1.30.2。

tsconfig.js：

{
    "compilerOptions": {
        "lib": [
            "es6",
            "dom"
        ],
        "noImplicitAny": true,
        "allowJs": true,
        "target": "es5",
        "strict": true,
        "module": "es6",
        "moduleResolution": "node",
        "outDir": "../../../dist/public/js",
        "sourceMap": true
    }
}

我尝试了以下方法：

• 重新安装打字稿和Vue
• 多次重启VS Code
• 手动重新启动TSServer
• 重新启动计算机

我现在完全陷入了困境-希望有人可以帮助我...

下面的代码示例（所有这些引用在我的VS代码中都有一条红线）：

import axios from "axios";
import Vue from "vue";

// tslint:disable-next-line no-unused-expression
new Vue({
    computed: {
        hasProvider(): boolean {
            // this line throw two errors
            return this.isLoading === false && this.providerList.length > 0;
        },
    },
    data() {
        return {
            description: "",
            id: "",
            isLoading: true,
            name: "",
            providerList: [],
        };
    },
    el: "#app",
    methods: {
        loadProviderList() {
            axios
                .get("/api/provider/all")
                .then((res: any) => {
                    // these lines throw an error
                    this.providerList = res.data.items;
                    this.isLoading = false;
                })
                .catch((err: any) => {
                    // tslint:disable-next-line:no-console
                    console.log(err);
                });
        }
    },
    mounted() {
        // this line throw an error
        return this.loadProviderList();
    }
});

Answer 1

今天就可以解决这个错误（VSCode中没有TypeScript的Vue）。

对于我们来说，它也从无到有，最终的罪魁祸首就是VSCode中的Vetur扩展需要重新加载。

Answer 2

在 settings.json 中，设置：

"vetur.experimental.templateInterpolationService": false

Answer 3

似乎问题出在我的mount（）阶段中的return语句。删除该退货（可能是我使用的示例中遗留下来的东西）可以解决问题。

mounted() {
        // this works
        this.loadProviderList();
}

还是很奇怪，环境从一天到一天都改变了行为，并且环境已经编译-可能永远无法得到答案：）