vue3 + typescript 全局属性设置类型报错

在Vue 3和TypeScript组合式API中，如果你在全局属性中遇到类型错误，可能是因为你没有正确地声明全局属性的类型。

解决方法：

1. 确保你在 setup 函数中使用 defineProps 或 useContext 时正确声明了类型。

import { defineComponent, PropType } from 'vue';
 
export default defineComponent({
  props: {
    message: {
      type: String as PropType<string>,
      required: true
    }
  },
  setup(props) {
    // 现在 TypeScript 知道 props.message 是字符串类型
    console.log(props.message.toUpperCase());
  }
});

2. 如果你是在 globalProperties 上设置全局属性，确保你在设置属性之前定义了正确的类型。

import { app } from 'vue';
 
// 设置全局属性之前定义类型
declare module '@vue/runtime-core' {
  export interface ComponentCustomProperties {
    $myGlobal: string;
  }
}
 
// 设置全局属性
app.config.globalProperties.$myGlobal = 'Hello Vue 3 + TypeScript';
 
// 在组件中使用
export default defineComponent({
  setup() {
    // 无需显式声明类型，TypeScript 会知道它是 string 类型
    console.log(this.$myGlobal);
  }
});

确保你的 TypeScript 配置文件 tsconfig.json 中包含了正确的类型声明目录（如果你的全局属性类型定义在外部文件中）。

如果你遵循了上述步骤但仍然遇到错误，请检查是否有其他类型错误或者是不匹配的类型定义，并进行相应的修正。