"Super expression must either be null or a function" 与 Vue 3 + vue-property-decorator

Question

我正在尝试使用 Vue 3 和 TypeScript 创建一个新项目。为此，我想使用 vue-property-decorator，因为我喜欢带有装饰器的类语法。

我使用 Vue CLI 创建了一个新的 Vue 3 + TypeScript 项目。

现在，如果我尝试将 vue-property-decorator 导入添加到 Vue 组件中，我会在浏览器控制台中收到错误"超级表达式必须是 null 或函数"。我的组件如下所示：

<template>
<div>Hi</div>
</template>
<script lang="ts">
import { Vue, Prop } from "vue-property-decorator";
export default class App extends Vue {
@Prop(Number) readonly propA: number | undefined;
@Prop({ default: "default value" }) readonly propB!: string;
@Prop([String, Boolean]) readonly propC: string | boolean | undefined;
}
</script>

该脚本只是复制粘贴到我的 App.vue 中的模块文档中的第一个示例。然后我的 main.ts 看起来像这样：

import { createApp } from "vue";
import App from "./App.vue";
createApp(App).mount("#app");

我看不出我的错误可能来自这一小段代码的哪个位置。没有其他组件，路由器或类似组件在任何地方导入。

Answer 1

在"导出默认类"部分上方添加@Component可以解决您的问题吗？

import { Vue, Prop, Component } from "vue-property-decorator";
@Component
export default class App extends Vue {

编辑：啊，从我所看到的 vue-property-decorator 还不支持 Vue 3 官方。不过，有一个候选版本(版本 10)支持它。

https://github.com/kaorun343/vue-property-decorator/blob/next/CHANGELOG.md