@uni-helper/uni-cloud-types

• @uni-helper/uni-app-types 提供 uni-app 组件类型
• @uni-helper/uni-cloud-types （当前仓库）提供 uni-cloud 组件类型
• @uni-helper/uni-ui-types 提供 uni-ui 组件类型

基于 这个 PR，Vue - Official（即 Volar） 已经支持。

安装之后，请参考 这里 配置你的 VS Code。启用或安装后需要重启 VS Code。

维护直到官方类型推出。

类型和文档的冲突之处，请以文档为准。

类型源代码在 uni-helper/uni-cloud-types。欢迎提交 ISSUE 和 PR 改进类型。

使用

• 安装依赖

  npm i -D @uni-helper/uni-app-types @uni-helper/uni-cloud-types

  yarn v2/v3

  请参考 文档 设置 nodeLinker 为 node_modules。

  pnpm

  请参考 文档 设置 shamefully-hoist 为 true。

• 配置 tsconfig.json，确保 compilerOptions.types 中含有 @dcloudio/types、@uni-helper/uni-app-types 和 @uni-helper/uni-cloud-types，且 include 包含了对应的 vue 文件

  2.0.14 <= Vue Language Features (Volar) & vue-tsc

  {
    "compilerOptions": {
      "types": [
        "@dcloudio/types",
        "@uni-helper/uni-app-types",
        "@uni-helper/uni-cloud-types"
      ]
    },
    "vueCompilerOptions": {
      "plugins": ["@uni-helper/uni-app-types/volar-plugin"]
    },
    "include": ["src/**/*.vue"]
  }

  1.7.12 <= Vue Language Features (Volar) & vue-tsc < 2.0.14

  {
    "compilerOptions": {
      "types": [
        "@dcloudio/types",
        "@uni-helper/uni-app-types",
        "@uni-helper/uni-cloud-types"
      ]
    },
    "vueCompilerOptions": {
      "nativeTags": ["block", "component", "template", "slot"]
    },
    "include": ["src/**/*.vue"]
  }

  1.5.1 <= Vue Language Features (Volar) & vue-tsc < 1.7.12

  {
    "compilerOptions": {
      "types": [
        "@dcloudio/types",
        "@uni-helper/uni-app-types",
        "@uni-helper/uni-cloud-types"
      ]
    },
    "include": ["src/**/*.vue"]
  }

  1.0.10 <= Vue Language Features (Volar) & vue-tsc < 1.5.1

  {
    "compilerOptions": {
      "types": [
        "@dcloudio/types",
        "@uni-helper/uni-app-types",
        "@uni-helper/uni-cloud-types"
      ]
    },
    "vueCompilerOptions": {
      "nativeTags": ["block", "component", "template", "slot"]
    },
    "include": ["src/**/*.vue"]
  }

  0.34.16 <= Vue Language Features (Volar) & vue-tsc < 1.0.10

  {
    "compilerOptions": {
      "types": [
        "@dcloudio/types",
        "@uni-helper/uni-app-types",
        "@uni-helper/uni-cloud-types"
      ]
    },
    "vueCompilerOptions": {
      "experimentalRuntimeMode": "runtime-uni-app"
    },
    "include": ["src/**/*.vue"]
  }

• 重启编辑器 / IDE

标注类型

推荐使用 @uni-helper/uni-cloud-types 导出的类型为变量标注类型。

<script setup lang="ts">
import { ref } from 'vue';
import type {
  UnicloudDbOnLoad,
  UnicloudDbSpaceInfoProvider,
} from '@uni-helper/uni-cloud-types';

const spaceInfoProvider = ref<UnicloudDbSpaceInfoProvider>('aliyun');
const onLoad: UnicloudDbOnLoad = (event) => {
  // ...
};
</script>

<template>
  <unicloud-db @load="onLoad"></unicloud-db>
</template>

也可以直接使用命名空间来为变量标注类型。

<script setup lang="ts">
import { ref } from 'vue';

const spaceInfoProvider = ref<UniHelper.UnicloudDbSpaceInfoProvider>(50);
const onLoad: UniHelper.UnicloudDbOnLoad = (event) => {
  // ...
};
</script>

<template>
  <unicloud-db @load="onLoad"></unicloud-db>
</template>

请查看 src 了解所有类型。

致谢

最初在 uni-base-components-types 得到了灵感。

基于 这个 PR 完成。