Vue 3 的 与 TypeScript 深度集成，通过自动推断、defineProps/defineEmits 泛型、显式泛型标注及组合式函数类型导出，实现精准静态类型检查。
Vue 3 的 setup 语法糖（<script setup></script>）与 TypeScript 配合得非常紧密，能实现比 Options API 更精准的类型推断——前提是写法规范、利用好编译器提示和内置工具类型。
自动类型推断：变量、函数、响应式数据无需显式标注
在 <script setup></script> 中，TypeScript 能基于初始化值、返回值、解构方式等自动推导类型，多数场景下不用写 : Type：
-
const count = ref(0)→ 推导为Ref<number></number> -
const user = reactive({ name: 'Alice', age: 30 })→ 推导为Reactive -
const onClick = (id: string) => { ... }→ 参数类型明确时，函数类型完整推导 - 解构
props时（配合defineProps），属性类型直接继承自泛型定义，IDE 可跳转、补全、校验
用 defineProps / defineEmits 显式声明，激活最强类型支持
避免使用运行时 props: {...} 声明，改用编译时宏 + 泛型，让 props 和 emits 具备完整静态类型：
-
const props = defineProps()→props.id是number，props.title是string | undefined -
const emit = defineEmits()→ 调用emit('update', 123)会立即报错（类型不匹配） - 支持从接口或类型别名导入：
defineProps<mycomponentprops>()</mycomponentprops>，便于跨组件复用定义
响应式 API 的类型陷阱与绕过技巧
某些组合式 API 在复杂场景下类型会变宽（如 ref(null) 推导为 Ref<null></null>），需主动收窄：
Galileo TypeScript sdk
下载
完整的Galileo AI平台 TypeScript/JS SDK 参考，用于评估、观察和保护 GenAI 应用。适用于构建 Node.js 或 TypeScript 项目。
-
const inputRef = ref<htmlinputelement null>(null)</htmlinputelement>—— 显式泛型指定 DOM 类型 -
const list = ref<item>([])</item>—— 避免ref([])被推为Ref<never></never> - 对
computed，若返回值逻辑复杂，可加类型标注：const total = computed<number>(() => ...)</number>，防止推导失败 - 使用
shallowRef或customRef时，泛型必不可少，否则失去类型精度
与组合式函数（composables）协同：导出类型即契约
自定义 Hook 应始终导出清晰的类型接口，<script setup></script> 消费时能无缝获得类型保障：
- 在
useFetch.ts中导出：export interface UseFetchReturn<t> { data: Ref<t null>; error: Ref<any>; execute: () => Promise<void> }</void></any></t></t> - 在组件中：
const { data, execute } = useFetch<user>('/api/user')</user>→data.value类型为User | null - 配合
defineExpose暴露子组件方法时，也应标注类型：defineExpose({ focus, reset })
不复杂但容易忽略：保持 tsconfig.json 启用 "strict": true 和 "skipLibCheck": false，并确保安装了 @vue/runtime-dom 以获得完整的 DOM 类型支持。TypeScript 不是锦上添花，而是 <script setup></script> 发挥类型威力的必要基础。
