typescript - 如何为 Typescript 和 Vue 3.0 配置类型（捆绑器和运行时编译）

Question

我正在关注 Vue入门指南，并希望使这个简单的示例工作：

HTML：

<div id="counter">
  Counter: {{ counter }}
</div>

打字稿：

const Counter = {
  data() {
    return {
      counter: 0
    }
  }
}

Vue.createApp(Counter).mount('#counter')

为此，我安装了：

npm install vue@next

我正在导入它：

import * as Vue from "vue";

HTML 片段和 Typescript 脚本被放入一个index.html文件中。这parcel与serve.

Vue 提供 Typescript 类型，如果我像这样导入 Vue，它们会被正确拾取。但是，当我打开托管项目时，会出现一条错误消息：

Component provided template option but runtime compilation is not supported in this build of Vue. Configure your bundler to alias "vue" to "vue/dist/vue.esm-bundler.

我遵循了建议并将导入更改为：

import * as Vue from "vue/dist/vue.esm-bundler";

这使得示例代码按预期工作。但是现在打字信息丢失了。

在允许运行时编译的同时，将 Vue 与 Typescript 和捆绑器结合起来的正确方法是什么？

标签： typescriptvue.jsvue-componentparceljs