Vue 3 是 Vue.js 的一个新版本，它引入了许多新特性和改进。TypeScript 是 JavaScript 的一个超集，它提供了类型系统来增强代码的可维护性和可预测性。
要在 Vue 3 中使用 TypeScript，你需要做以下几步：
- 创建一个新的 Vue 3 项目并启用 TypeScript：
# 使用 Vue CLI 创建项目
vue create my-vue3-project
# 在提示选择预设时，选择 "Manually select features"
# 然后选择 "TypeScript" 和其他你需要的特性
# 最后，确保选择了 Vue 3 作为版本- 在你的 Vue 组件中使用 TypeScript：
<script lang="ts">
import { defineComponent } from 'vue';
export default defineComponent({
name: 'MyComponent',
setup() {
// 这里可以写 TypeScript 代码
}
});
</script>- 配置 TypeScript 编译选项（可能需要在
tsconfig.json中调整）。 - 添加类型声明文件，如
.d.ts文件，以扩展 TypeScript 对 Vue 3 的理解。
这是一个简单的 Vue 3 组件示例，使用 TypeScript 编写：
<template>
<div>{{ message }}</div>
</template>
<script lang="ts">
import { defineComponent } from 'vue';
export default defineComponent({
name: 'HelloWorld',
data() {
return {
message: 'Hello, Vue 3 + TypeScript!'
};
}
});
</script>以上代码创建了一个简单的 Vue 3 组件，它在页面上显示一条欢迎消息。这只是 Vue 3 和 TypeScript 结合使用的一个基本示例，实际项目中会涉及更复杂的类型声明和工程配置。