feat(ui): 添加 TDesign-Uni 组件库支持

FliPPeDround · FliPPeDround · commit 0b017d0961a7 · 2026-02-09T18:14:43.000+08:00
diff --git a/.github/workflows/core_test.yml b/.github/workflows/core_test.yml
@@ -61,7 +61,7 @@ jobs:
         flag-for-ts: ['', --ts]
         flag-for-eslint: [-e]
         flag-for-plugin: [-p import -p pages -p layouts -p manifest -p filePlatform -p root -p componentPlaceholder -m pinia -m unocss -m uniNetwork -m uniUse -m uniPromises -m uniEcharts -m zPaging]
-        flag-for-ui: ['', -u uni, -u ano, -u wot, -u nut, -u uv]
+        flag-for-ui: ['', -u uni, -u ano, -u wot, -u nut, -u uv, -u tdesign]
 
         node: [20.x]
         os: [windows-latest, macos-latest]
diff --git a/README.md b/README.md
@@ -99,6 +99,7 @@ npx @create-uni/info@latest
 | :---: | :---: | :---: |
 | [uni-ui](https://uniapp.dcloud.net.cn/component/uniui/uni-ui.html) | UniApp 官方组件库 | uni |
 | [wot-ui](https://wot-ui.cn/) | 高颜值、轻量化的 uni-app 组件库 | wot |
+| [TDesign-Uni](https://tdesign.tencent.com/uni-app/) | Tencent Design 组件库的 uni-app 版本 | tdesign |
 | [uView-Pro](https://uviewpro.cn/) | 全面支持 Vue3.0、TypeScript 的 uni-app 生态框架 | uview-pro |
 | [nutui-uniapp](https://uniapp-nutui.tech/) | 京东风格的轻量级移动端组件库 | nut |
 | [uv-ui](https://www.uvui.cn/components/intro.html) | 多平台快速开发的 UI 框架 | uv |
diff --git a/packages/config/src/ui.data.ts b/packages/config/src/ui.data.ts
@@ -23,13 +23,21 @@ export default [
     github: 'https://github.com/Moonofweisheng/wot-design-uni',
     website: 'https://wot-ui.cn/',
   },
+  {
+    label: rgb(0, 82, 217)('TDesign Uni'),
+    hint: 'Tencent Design 组件库的 uni-app 版本',
+    name: 'TDesign-Uni',
+    value: 'tdesign',
+    github: 'https://github.com/Tencent/tdesign-uni',
+    website: 'https://tdesign.tencent.com/uni-app/',
+  },
   {
     label: rgb(41, 121, 255)('uView Pro'),
     hint: '全面支持 Vue3.0、TypeScript 的 uni-app 生态框架',
     name: 'uView Pro',
     value: 'uview-pro',
-    github: 'https://github.com/anyup/uView-Pro',
-    website: 'https://uviewpro.cn/',
+    github: 'https://github.com/Tencent/tdesign-miniprogram',
+    website: 'https://tdesign.tencent.com/uniapp/',
   },
   {
     label: rgb(250, 44, 25)('Nut Ui'),
diff --git a/packages/core/template/UI/tdesign/package.json b/packages/core/template/UI/tdesign/package.json
@@ -0,0 +1,5 @@
+{
+  "dependencies": {
+    "@tdesign/uniapp": "^0.7.1"
+  }
+}
diff --git a/packages/core/template/UI/tdesign/src/components/InputEntry.vue b/packages/core/template/UI/tdesign/src/components/InputEntry.vue
@@ -0,0 +1,58 @@
+<script setup lang="ts">
+import { ref } from 'vue'
+
+const name = ref('')
+const visible = ref(false)
+
+function handleClick() {
+  visible.value = true
+}
+</script>
+
+<template>
+  <view class="input-box">
+    <input
+      v-model="name"
+      placeholder="What's your name?"
+    >
+  </view>
+  <view>
+    <t-button
+      block
+      size="large"
+      variant="outline"
+      theme="primary"
+      :disabled="!name"
+      @click="handleClick"
+    >
+      Hello
+    </t-button>
+  </view>
+
+  <t-popup
+    :visible="visible"
+    placement="bottom"
+    @update:visible="visible = $event"
+  >
+    <view class="block block--bottom">
+      Hello{{ `  ${name}` }} 👏
+    </view>
+  </t-popup>
+</template>
+
+<style scoped lang="scss">
+.input-box {
+  margin: 1rem;
+  padding: 0.5rem;
+  border-bottom: 1px solid gray;
+}
+
+.block {
+  color: var(--td-text-color-secondary);
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  width: 100vw;
+  height: 240px;
+}
+</style>
diff --git a/packages/core/template/UI/tdesign/vite.config.js.data.mjs b/packages/core/template/UI/tdesign/vite.config.js.data.mjs
@@ -0,0 +1,15 @@
+export default function getData({ oldData, utils }) {
+  const autoImportTDesignUniPlugin = {
+    id: 'tdesign-uni',
+    importer: `import { TDesignUniappResolver } from '@uni-helper/vite-plugin-uni-components/resolvers'`,
+  }
+
+  return {
+    ...oldData,
+    plugins: oldData.plugins.flatMap(plugin =>
+      plugin.id === 'autoImport'
+        ? [utils.addResolver(plugin, 'TDesignUniappResolver()'), autoImportTDesignUniPlugin]
+        : plugin,
+    ),
+  }
+}
diff --git a/packages/core/template/config/typescript/jsconfig.json.data.mjs b/packages/core/template/config/typescript/jsconfig.json.data.mjs
@@ -3,7 +3,7 @@ export default function getData({ oldData }) {
     id: 'tsConfig',
     options: `"lib": ["DOM", "DOM.Iterable", "ESNext"],
     "module": "ESNext",
-    "moduleResolution": "Bundler",
+    "moduleResolution": "bundler",
     "resolveJsonModule": true,
     "jsx": "preserve",
     "jsxImportSource": "vue",
diff --git a/packages/mcp/test/promptBuilder.test.ts b/packages/mcp/test/promptBuilder.test.ts
@@ -20,6 +20,7 @@ it('promptBuilder', () => {
     - " ": 不安装
     - uni: UniApp官方组件库
     - wot: 高颜值、轻量化的uni-app组件库
+    - tdesign: Tencent Design 组件库的 uni-app 版本
     - uview-pro: 全面支持 Vue3.0、TypeScript 的 uni-app 生态框架
     - nut: 京东风格的轻量级移动端组件库
     - uv: 多平台快速开发的UI框架
@@ -33,6 +34,7 @@ it('getConfigValuesAsEnum', () => {
       " ",
       "uni",
       "wot",
+      "tdesign",
       "uview-pro",
       "nut",
       "uv",
@@ -47,6 +49,8 @@ it('templatePromptBuilder', () => {
     - vitesse: 由Uni Helper维护的快速启动模板
     - wot-starter: 由Wot UI提供的基于 vitesse-uni-app 的快速启动模板
     - wot-starter-retail: 基于Wot UI的 uni-app 零售行业模板
+    - uview-pro-starter: 由 uView Pro 提供的基于 vitesse-uni-app 的快速启动模板
+    - uview-pro-demo: 由 uView Pro 提供的完整组件演示模板
     - unisave: 拥抱 web 开发，拯救uniapp。适配所有 (app、mp、web) 平台
     - tmui32: 优质 Vue3 TS Pinia Vite 跨端组件库模板"
   `)
@@ -58,6 +62,8 @@ it('getTemplateValuesAsEnum', () => {
       "vitesse",
       "wot-starter",
       "wot-starter-retail",
+      "uview-pro-starter",
+      "uview-pro-demo",
       "unisave",
       "tmui32",
     ]
diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml

-Original file line number
+Diff line change
@@ @@ -0,0 +1,5 @@ @@
 +{
 +  "dependencies": {
 +    "@tdesign/uniapp": "^0.7.1"
 +  }
 +}