refactor: packages/tdesign-vue-next for site (#5036)

* refactor: mv site to packages/tdesign-vue-next/site * refactor: site * refactor: package.json site script * refactor: camelcase change to lodash-es * refactor: generate-coverage.js * fix: generate-coverage key * chore: fix lint * fix: use lodash at vite plugin md-to-vue * fix: site.config.mjs path * feat: change site output * refactor: site preview scripts * refactor: pull-request yml support site * refactor: tag-push yml support site * refactor: preview-publish.yml support site * fix: vue version form dep
Tencent · Feb 18, 2025 · db6da2b · db6da2b
1 parent f2761ef
commit db6da2b
Show file tree

Hide file tree

Showing 37 changed files with 190 additions and 95 deletions.
diff --git a/.github/workflows/preview-publish.yml b/.github/workflows/preview-publish.yml
@@ -1,6 +1,20 @@
 # 文件名建议统一为 preview-publish
 # 应用 preview.yml 的 demo
 
+# name: PREVIEW_PUBLISH
+
+# on:
+#   workflow_run:
+#     workflows: ["MAIN_PULL_REQUEST"]
+#     types:
+#       - completed
+
+# jobs:
+#   call-preview:
+#     uses: Tencent/tdesign/.github/workflows/preview.yml@main
+#     secrets:
+#       TDESIGN_SURGE_TOKEN: ${{ secrets.TDESIGN_SURGE_TOKEN }}
+
 name: PREVIEW_PUBLISH
 
 on:
@@ -10,7 +24,85 @@ on:
       - completed
 
 jobs:
-  call-preview:
-    uses: Tencent/tdesign/.github/workflows/preview.yml@main
-    secrets:
-      TDESIGN_SURGE_TOKEN: ${{ secrets.TDESIGN_SURGE_TOKEN }}
+  preview-success:
+    runs-on: ubuntu-latest
+    if: >
+      github.event.workflow_run.event == 'pull_request' &&
+      github.event.workflow_run.conclusion == 'success'
+    steps:
+      - name: download pr artifact
+        uses: dawidd6/action-download-artifact@v6
+        with:
+          workflow: ${{ github.event.workflow_run.workflow_id }}
+          run_id: ${{ github.event.workflow_run.id }}
+          name: pr
+      - name: save PR id
+        id: pr
+        run: echo "id=$(<pr-id.txt)" >> $GITHUB_OUTPUT
+      - name: download site artifact
+        uses: dawidd6/action-download-artifact@v6
+        with:
+          workflow: ${{ github.event.workflow_run.workflow_id }}
+          run_id: ${{ github.event.workflow_run.id }}
+          name: site
+      - run: |
+          unzip site.zip
+
+      - name: Upload surge service and generate preview URL
+        id: deploy
+        run: |
+          repository=${{github.repository}}
+          project_name=${repository#*/}
+          export DEPLOY_DOMAIN=https://preview-pr-${{ steps.pr.outputs.id }}-$project_name.surge.sh
+          npx surge --project packages/tdesign-vue-next/site/dist --domain $DEPLOY_DOMAIN --token ${{ secrets.TDESIGN_SURGE_TOKEN }}
+          echo the preview URL is $DEPLOY_DOMAIN
+          echo "url=$DEPLOY_DOMAIN" >> $GITHUB_OUTPUT
+      - name: update status comment
+        uses: actions-cool/maintain-one-comment@v3
+        with:
+          token: ${{ secrets.GITHUB_TOKEN }}
+          body: |
+            <a href="${{steps.deploy.outputs.url}}"><img height="96" alt="完成" src="https://user-images.githubusercontent.com/15634204/150816437-9f5bb788-cd67-4cbc-9897-b82d74e9aa65.png" /></a>
+            <!-- [工作流地址](${{github.server_url}}/${{github.repository}}/actions/runs/${{github.run_id}}) -->
+            <!-- AUTO_PREVIEW_HOOK -->
+          number: ${{ steps.pr.outputs.id }}
+          body-include: "<!-- AUTO_PREVIEW_HOOK -->"
+
+      - run: |
+          rm -rf packages/tdesign-vue-next/site/dist
+
+      - name: The job failed
+        if: ${{ failure() }}
+        uses: actions-cool/maintain-one-comment@v3
+        with:
+          token: ${{ secrets.GITHUB_TOKEN }}
+          body: |
+            [<img height="96" alt="失败" src="https://user-images.githubusercontent.com/5378891/75333447-1e63a280-58c1-11ea-975d-235367fd1522.png">](${{github.server_url}}/${{github.repository}}/actions/runs/${{github.run_id}})
+            <!-- AUTO_PREVIEW_HOOK -->
+          number: ${{ steps.pr.outputs.id }}
+          body-include: "<!-- AUTO_PREVIEW_HOOK -->"
+
+  preview-failed:
+    runs-on: ubuntu-latest
+    if: >
+      github.event.workflow_run.event == 'pull_request' &&
+      github.event.workflow_run.conclusion == 'failure'
+    steps:
+      - name: download pr artifact
+        uses: dawidd6/action-download-artifact@v6
+        with:
+          workflow: ${{ github.event.workflow_run.workflow_id }}
+          run_id: ${{ github.event.workflow_run.id }}
+          name: pr
+      - name: save PR id
+        id: pr
+        run: echo "id=$(<pr-id.txt)" >> $GITHUB_OUTPUT
+      - name: The job failed
+        uses: actions-cool/maintain-one-comment@v3
+        with:
+          token: ${{ secrets.GITHUB_TOKEN }}
+          body: |
+            [<img height="96" alt="失败" src="https://user-images.githubusercontent.com/5378891/75333447-1e63a280-58c1-11ea-975d-235367fd1522.png">](${{github.server_url}}/${{github.repository}}/actions/runs/${{github.run_id}})
+            <!-- AUTO_PREVIEW_HOOK -->
+          number: ${{ steps.pr.outputs.id }}
+          body-include: "<!-- AUTO_PREVIEW_HOOK -->"
diff --git a/.github/workflows/pull-request.yml b/.github/workflows/pull-request.yml
@@ -165,18 +165,18 @@ jobs:
       - name: Build site
         run: pnpm run site:preview
 
-      # 将构建的站点文件压缩为 zip
+      # 将构建的 tdesign-vue-next 站点文件压缩为 zip
       - run: |
-          zip -r _site.zip _site
+          zip -r site.zip packages/tdesign-vue-next/site/dist
 
       # 上传站点文件作为构建产物
-      - name: upload _site artifact
+      - name: upload site artifact
         uses: actions/upload-artifact@v4
         with:
           # 产物名称
-          name: _site
+          name: site
           # 产物路径
-          path: _site.zip
+          path: site.zip
           # 产物保留天数
           retention-days: 5
 

diff --git a/.github/workflows/tag-push.yml b/.github/workflows/tag-push.yml
@@ -120,7 +120,7 @@ jobs:
           ref_name=${{ github.ref_name }}
           tag_name=${ref_name//./_}
           export DEPLOY_DOMAIN=https://$tag_name-$project_name.surge.sh
-          npx surge --project _site --domain $DEPLOY_DOMAIN --token ${{ secrets.TDESIGN_SURGE_TOKEN }}
+          npx surge --project packages/tdesign-vue-next/site/dist --domain $DEPLOY_DOMAIN --token ${{ secrets.TDESIGN_SURGE_TOKEN }}
           echo $DEPLOY_DOMAIN
    
   UPDATE_OFFICIAL_WEBSITE:

diff --git a/package.json b/package.json
@@ -16,14 +16,13 @@
   "scripts": {
     "init": "git submodule init && git submodule update",
     "start": "pnpm run init && pnpm dev",
-    "dev": "pnpm -C site dev",
-    "site": "pnpm -C site build",
-    "site:intranet": "pnpm -C site intranet",
-    "site:preview": "pnpm -C site preview",
-    "postsite:preview": "cp _site/index.html _site/404.html",
+    "dev": "pnpm -C packages/tdesign-vue-next/site dev",
+    "site": "pnpm -C packages/tdesign-vue-next/site build",
+    "site:intranet": "pnpm -C packages/tdesign-vue-next/site intranet",
+    "site:preview": "pnpm -C packages/tdesign-vue-next/site preview",
     "generate:usage": "node script/generate-usage/index.js",
     "generate:component": "node script/init/index.js",
-    "generate:coverage-badge": "pnpm test:unit-coverage && node script/test/generate-coverage.js",
+    "generate:coverage-badge": "pnpm test:unit-coverage && tsx script/test/generate-coverage.js",
     "build": "cross-env NODE_ENV=production rollup -c script/rollup.config.js && pnpm build:tsc",
     "build:tsc": "run-p build:tsc-*",
     "build:tsc-es": "tsc --outDir packages/tdesign-vue-next/es/ -p tsconfig.components.json",
@@ -36,11 +35,11 @@
     "test": "pnpm -C packages/tdesign-vue-next/test test",
     "test:unit": "pnpm -C packages/tdesign-vue-next/test test:unit",
     "test:update": "pnpm -C packages/tdesign-vue-next/test test:update",
-    "test:unit-dev":"pnpm -C packages/tdesign-vue-next/test test:unit-dev",
-    "test:unit-gui":"pnpm -C packages/tdesign-vue-next/test test:unit-gui",
-    "test:unit-coverage":"pnpm -C packages/tdesign-vue-next/test test:unit-coverage",
+    "test:unit-dev": "pnpm -C packages/tdesign-vue-next/test test:unit-dev",
+    "test:unit-gui": "pnpm -C packages/tdesign-vue-next/test test:unit-gui",
+    "test:unit-coverage": "pnpm -C packages/tdesign-vue-next/test test:unit-coverage",
     "test:snap": "pnpm -C packages/tdesign-vue-next/test test:snap",
-    "test:snap-update":"pnpm -C packages/tdesign-vue-next/test test:snap-update",
+    "test:snap-update": "pnpm -C packages/tdesign-vue-next/test test:snap-update",
     "robot": "publish-cli robot-msg",
     "prepare": "husky install"
   },
@@ -95,13 +94,11 @@
     "@vitejs/plugin-vue-jsx": "^1.3.10",
     "@vitest/ui": "^2.1.8",
     "@vue/babel-plugin-jsx": "1.2.2",
-    "@vue/compiler-sfc": "^3.3.4",
     "@vue/eslint-config-typescript": "^10.0.0",
     "@vue/test-utils": "^2.4.1",
     "autoprefixer": "^10.4.14",
     "babel-eslint": "^10.1.0",
     "c8": "^7.14.0",
-    "camelcase": "~6.3.0",
     "cli-color": "^2.0.3",
     "clipboard": "^2.0.11",
     "codesandbox": "^2.2.3",
@@ -120,14 +117,12 @@
     "husky": "^7.0.4",
     "ignore": "^5.2.4",
     "jsdom": "^19.0.0",
-    "less": "^4.1.3",
     "lint-staged": "^13.2.3",
     "mockdate": "^3.0.5",
     "msw": "^1.2.3",
     "npm-run-all2": "^7.0.2",
     "postcss": "^8.4.26",
     "prettier": "2.8.1",
-    "prismjs": "^1.29.0",
     "raf": "^3.4.1",
     "rimraf": "^5.0.1",
     "rollup": "^2.79.1",
@@ -142,19 +137,9 @@
     "rollup-plugin-styles": "^4.0.0",
     "rollup-plugin-terser": "^7.0.2",
     "rollup-plugin-vue": "^6.0.0",
-    "semver": "^7.5.4",
-    "tdesign-icons-view": "^0.3.4",
     "tdesign-publish-cli": "^0.0.12",
-    "tdesign-site-components": "0.16.0-alpha.6",
-    "tdesign-theme-generator": "^1.0.11",
-    "typescript": "^5.7.3",
-    "vite": "^2.9.16",
-    "vite-plugin-pwa": "^0.12.8",
-    "vite-plugin-tdoc": "^2.0.4",
-    "vitest": "^2.1.8",
-    "vue": "3.3.9",
-    "vue-router": "^4.2.4",
-    "workbox-precaching": "^6.6.0"
+    "tsx": "^4.19.2",
+    "typescript": "^5.7.3"
   },
   "config": {
     "commitizen": {

diff --git a/site/docs/getting-started.en-US.md → ...e-next/site/docs/getting-started.en-US.md b/site/docs/getting-started.en-US.md → ...e-next/site/docs/getting-started.en-US.md
diff --git a/site/docs/getting-started.md → ...ign-vue-next/site/docs/getting-started.md b/site/docs/getting-started.md → ...ign-vue-next/site/docs/getting-started.md
diff --git a/site/docs/starter.en-US.md → ...esign-vue-next/site/docs/starter.en-US.md b/site/docs/starter.en-US.md → ...esign-vue-next/site/docs/starter.en-US.md
diff --git a/site/docs/starter.md → ...ges/tdesign-vue-next/site/docs/starter.md b/site/docs/starter.md → ...ges/tdesign-vue-next/site/docs/starter.md
diff --git a/site/index.html → packages/tdesign-vue-next/site/index.html b/site/index.html → packages/tdesign-vue-next/site/index.html
diff --git a/packages/tdesign-vue-next/site/package.json b/packages/tdesign-vue-next/site/package.json
@@ -0,0 +1,34 @@
+{
+  "name": "@tdesign/vue-next-site",
+  "private": true,
+  "scripts": {
+    "start": "pnpm run dev",
+    "dev": "vite",
+    "build": "vite build",
+    "intranet": "vite build --mode intranet",
+    "preview": "vite build --mode preview && cp dist/index.html dist/404.html"
+  },
+  "author": "tdesign",
+  "license": "MIT",
+  "dependencies": {
+    "semver": "^7.5.4",
+    "vue": "3.3.9",
+    "vue-router": "^4.2.4",
+    "workbox-precaching": "^6.6.0"
+  },
+  "devDependencies": {
+    "@types/lodash": "^4.17.15",
+    "@vitejs/plugin-vue": "^2.3.4",
+    "@vitejs/plugin-vue-jsx": "^1.3.10",
+    "@vue/compiler-sfc": "^3.3.4",
+    "less": "^4.1.3",
+    "lodash": "^4.17.21",
+    "prismjs": "^1.29.0",
+    "tdesign-icons-view": "^0.3.4",
+    "tdesign-site-components": "0.16.0-alpha.6",
+    "tdesign-theme-generator": "^1.0.11",
+    "vite": "^2.9.16",
+    "vite-plugin-pwa": "^0.12.8",
+    "vite-plugin-tdoc": "^2.0.4"
+  }
+}
diff --git a/site/plugin-doc/demo.js → .../tdesign-vue-next/site/plugin-doc/demo.js b/site/plugin-doc/demo.js → .../tdesign-vue-next/site/plugin-doc/demo.js
diff --git a/site/plugin-doc/index.js → ...tdesign-vue-next/site/plugin-doc/index.js b/site/plugin-doc/index.js → ...tdesign-vue-next/site/plugin-doc/index.js
diff --git a/site/plugin-doc/md-to-vue.js → ...ign-vue-next/site/plugin-doc/md-to-vue.js b/site/plugin-doc/md-to-vue.js → ...ign-vue-next/site/plugin-doc/md-to-vue.js
@@ -2,8 +2,8 @@
 import fs from 'fs';
 import path from 'path';
 import matter from 'gray-matter';
-import { compileUsage, getGitTimestamp } from '../../packages/common/docs/compile';
-import camelCase from 'camelcase';
+import { compileUsage, getGitTimestamp } from '../../../../packages/common/docs/compile';
+import camelCase from 'lodash/camelCase';
 
 import testCoverage from '../test-coverage';
 
@@ -196,7 +196,7 @@ async function customRender({ source, file, md }) {
       componentName,
       usage: pageData.usage,
       demoPath: path.posix
-        .resolve(__dirname, `../../packages/components/${componentName}/_usage/index.vue`)
+        .resolve(__dirname, `../../../../packages/components/${componentName}/_usage/index.vue`)
         .replace(/\\/g, '/'),
     });
     if (usageObj) {
@@ -223,7 +223,7 @@ async function customRender({ source, file, md }) {
 
   // 设计指南内容 不展示 design Tab 则不解析
   if (pageData.isComponent && pageData.tdDocTabs.some((item) => item.tab === 'design')) {
-    const designDocPath = path.resolve(__dirname, `../../packages/common/docs/web/design/${componentName}.md`);
+    const designDocPath = path.resolve(__dirname, `../../../../packages/common/docs/web/design/${componentName}.md`);
 
     if (fs.existsSync(designDocPath)) {
       const designDocLastUpdated =

diff --git a/site/plugin-doc/transforms.js → ...gn-vue-next/site/plugin-doc/transforms.js b/site/plugin-doc/transforms.js → ...gn-vue-next/site/plugin-doc/transforms.js
@@ -12,14 +12,13 @@ export default {
     const reg = file.match(/([\w-]+)\.?([\w-]+)?\.md/);
     const fileName = reg && reg[0];
     const componentName = reg && reg[1];
-    const localeName = reg && reg[2];
     demoImports = {};
     demoCodesImports = {};
 
     // 统一换成 common 公共文档内容
     if (fileName && source.includes(':: BASE_DOC ::')) {
-      const localeDocPath = path.resolve(__dirname, `../../packages/common/docs/web/api/${fileName}`);
-      const defaultDocPath = path.resolve(__dirname, `../../packages/common/docs/web/api/${componentName}.md`);
+      const localeDocPath = path.resolve(__dirname, `../../../../packages/common/docs/web/api/${fileName}`);
+      const defaultDocPath = path.resolve(__dirname, `../../../../packages/common/docs/web/api/${componentName}.md`);
       let baseDoc = '';
       if (fs.existsSync(localeDocPath)) {
         // 优先载入语言版本

diff --git a/site/public/apple-touch-icon.png → ...vue-next/site/public/apple-touch-icon.png b/site/public/apple-touch-icon.png → ...vue-next/site/public/apple-touch-icon.png
diff --git a/site/public/favicon.ico → .../tdesign-vue-next/site/public/favicon.ico b/site/public/favicon.ico → .../tdesign-vue-next/site/public/favicon.ico
diff --git a/site/public/logo.svg → ...ges/tdesign-vue-next/site/public/logo.svg b/site/public/logo.svg → ...ges/tdesign-vue-next/site/public/logo.svg
diff --git a/site/public/pwa-192x192.png → ...sign-vue-next/site/public/pwa-192x192.png b/site/public/pwa-192x192.png → ...sign-vue-next/site/public/pwa-192x192.png
diff --git a/site/public/pwa-512x512.png → ...sign-vue-next/site/public/pwa-512x512.png b/site/public/pwa-512x512.png → ...sign-vue-next/site/public/pwa-512x512.png
diff --git a/site/sw.js → packages/tdesign-vue-next/site/public/sw.js b/site/sw.js → packages/tdesign-vue-next/site/public/sw.js
@@ -1,5 +1,6 @@
 import { precacheAndRoute } from 'workbox-precaching';
 
+// eslint-disable-next-line no-underscore-dangle
 precacheAndRoute(self.__WB_MANIFEST);
 
 self.addEventListener('message', (event) => {

diff --git a/site/pwaConfig.js → packages/tdesign-vue-next/site/pwaConfig.js b/site/pwaConfig.js → packages/tdesign-vue-next/site/pwaConfig.js
diff --git a/site/site.config.mjs → ...ges/tdesign-vue-next/site/site.config.mjs b/site/site.config.mjs → ...ges/tdesign-vue-next/site/site.config.mjs
@@ -9,23 +9,23 @@ export const docs = [
         titleEn: 'Getting Started',
         name: 'getting-started',
         path: '/vue-next/getting-started',
-        component: () => import('@/site/docs/getting-started.md'),
-        componentEn: () => import('@/site/docs/getting-started.en-US.md'),
+        component: () => import('@/packages/tdesign-vue-next/site/docs/getting-started.md'),
+        componentEn: () => import('@/packages/tdesign-vue-next/site/docs/getting-started.en-US.md'),
       },
       {
         title: '最佳实践',
         titleEn: 'Starter Kit',
         name: 'quick-start',
         path: '/vue-next/quick-start',
-        component: () => import('@/site/docs/starter.md'),
-        componentEn: () => import('@/site/docs/starter.en-US.md'),
+        component: () => import('@/packages/tdesign-vue-next/site/docs/starter.md'),
+        componentEn: () => import('@/packages/tdesign-vue-next/site/docs/starter.en-US.md'),
       },
       {
         title: '更新日志',
         titleEn: 'CHANGELOG',
         name: 'changelog',
         path: '/vue-next/changelog',
-        component: () => import('@/CHANGELOG.md'),
+        component: () => import('@/packages/tdesign-vue-next/CHANGELOG.md'),
       },
       {
         title: '组件概览',

diff --git a/site/src/app.vue → packages/tdesign-vue-next/site/src/app.vue b/site/src/app.vue → packages/tdesign-vue-next/site/src/app.vue
@@ -6,8 +6,8 @@
 
 <script setup>
 import { onMounted, ref } from 'vue';
-import cnConfig from 'tdesign-vue-next/es/locale/zh_CN';
-import enConfig from 'tdesign-vue-next/es/locale/en_US';
+import cnConfig from '@tdesign/components/locale/zh_CN';
+import enConfig from '@tdesign/components/locale/en_US';
 import { getLang } from 'tdesign-site-components';
 
 const globalConfig = ref(cnConfig);

diff --git a/site/src/components/base-usage.vue → ...e-next/site/src/components/base-usage.vue b/site/src/components/base-usage.vue → ...e-next/site/src/components/base-usage.vue
@@ -18,7 +18,7 @@
 </template>
 
 <script setup lang="jsx">
-import { ref, compile, onMounted, computed, onBeforeUnmount, watchEffect } from 'vue';
+import { ref, onMounted, computed, onBeforeUnmount, watchEffect } from 'vue';
 import * as prettier from 'prettier/standalone';
 import * as parserHtml from 'prettier/parser-html';
 

diff --git a/site/src/components/codeSandbox/content.js → ...ite/src/components/codeSandbox/content.js b/site/src/components/codeSandbox/content.js → ...ite/src/components/codeSandbox/content.js
@@ -1,4 +1,5 @@
-import orgPkg from '../../../../package.json';
+import orgPkg from '../../../package.json';
+import tdesignVueNextPkg from '../../../../package.json';
 
 export const htmlContent = `<div id="app"></div>`;
 
@@ -43,10 +44,10 @@ export const packageJSONContent = (name) => {
   return {
     name: name,
     dependencies: {
-      vue: orgPkg.devDependencies.vue,
+      vue: orgPkg.dependencies.vue,
       less: orgPkg.devDependencies.less,
-      'tdesign-vue-next': orgPkg.version,
-      'tdesign-icons-vue-next': orgPkg.dependencies['tdesign-icons-vue-next'],
+      'tdesign-vue-next': tdesignVueNextPkg.version,
+      'tdesign-icons-vue-next': tdesignVueNextPkg.dependencies['tdesign-icons-vue-next'],
     },
     devDependencies: {
       '@vue/cli-plugin-babel': '~4.5.0',

diff --git a/site/src/components/codeSandbox/index.vue → ...site/src/components/codeSandbox/index.vue b/site/src/components/codeSandbox/index.vue → ...site/src/components/codeSandbox/index.vue
diff --git a/site/src/components/components.jsx → ...e-next/site/src/components/components.jsx b/site/src/components/components.jsx → ...e-next/site/src/components/components.jsx
@@ -3,7 +3,8 @@ import semver from 'semver';
 import siteConfig from '../../site.config';
 import { htmlContent, mainJsContent, styleContent, packageJSONContent } from './codeSandbox/content';
 
-import packageJson from '../../../packages/tdesign-vue-next/package.json';
+// TODO
+import packageJson from '../../../package.json';
 
 const { docs, enDocs } = JSON.parse(JSON.stringify(siteConfig).replace(/component:.+/g, ''));