feat: [Group 2] Update template pages

.env.development

@@ -2,4 +2,12 @@
 VITE_BASE_PATH = '/'
 
 # 开发环境路由模式，推荐 hash
-VITE_ROUTER_MODE = 'hash'
+VITE_ROUTER_MODE = 'hash'
+
+DEV = 'true'
+
+#MSW
+VITE_MSW=true
+
+#baseUrl
+VITE_API_BASE='/api'

.env.production

@@ -2,4 +2,10 @@
 VITE_BASE_PATH = '/'
 
 # 打包环境路由模式，推荐 history
-VITE_ROUTER_MODE = 'history'
+VITE_ROUTER_MODE = 'history'
+
+# MSW
+VITE_MSW=true
+
+#baseUrl
+VITE_API_BASE='/api'

.gitignore

@@ -10,4 +10,8 @@ npm-debug.log*
 .pnpm-error.log*
 .pnpm-debug.log
 
-.idea
+.idea
+
+# VitePress
+docs/.vitepress/dist
+docs/.vitepress/cache

.husky/commit-msg

@@ -1,7 +1,7 @@
 #!/bin/sh
 
 # shellcheck source=./_/husky.sh
-. "$(dirname "$0")/_/husky.sh"
+# . "$(dirname "$0")/_/husky.sh" 
 
 PATH="/usr/local/bin:$PATH"
 

.husky/pre-commit

@@ -1,5 +1,4 @@
 #!/bin/sh
-. "$(dirname "$0")/_/husky.sh"
 . "$(dirname "$0")/common.sh"
 
 [ -n "$CI" ] && exit 0

.lintstagedrc

@@ -1,13 +1,13 @@
 {
   "*.{js,jsx,ts,tsx}": [
-    "eslint --cache --fix"
+    "eslint --cache --fix --ignore-pattern public/mockServiceWorker.js"
   ],
   "{!(package)*.json,*.code-snippets,.!({browserslist,npm,nvm})*rc}": [
     "eslint --cache --fix"
   ],
   "package.json": ["eslint --cache --fix"],
   "*.vue": [
-    "eslint --cache --fix"
+    "eslint --cache --fix --ignore-pattern public/mockServiceWorker.js"
   ],
   "*.md": ["eslint --cache --fix"]
 }

.vscode/settings.json

@@ -54,7 +54,7 @@
   "editor.formatOnPaste": true,
   "editor.guides.bracketPairs": "active",
   "typescript.tsdk": "node_modules\\typescript\\lib",
-  "files.autoSave": "off",
+  "files.autoSave": "afterDelay",
   "git.confirmSync": false,
   "files.associations": {
     "editor.snippetSuggestions": "top"

README.md

@@ -174,6 +174,18 @@
 
 - 在 `.vue` 空文件里输入 `vue` 可弹出代码片段，快速搭建基础文件结构（仅限 `vscode`）
 
+### 🧪 前端 Mock（MSW）
+
+项目内置 [MSW](https://mswjs.io) 用于在浏览器端拦截 `fetch`/XHR 请求并返回模拟数据。
+
+- 开启：
+  - 开发：在 `.env.local` 设置 `VITE_MSW=true`，或在控制台执行 `window.__MSW_ENABLED__=true` 后刷新。
+  - 生产：同样设置 `VITE_MSW=true` 并确保 `public/mockServiceWorker.js` 已随站点发布。
+- 关闭：将开关设为 `false` 或移除，刷新页面。
+- 约定：
+  - handlers 位于 `src/mocks/handlers.ts`，已覆盖 `/api` 开头接口（使用 `*/api/...` 通配）。
+  - 启动逻辑在 `src/mocks/index.ts`，于 `src/main.ts` 初始化阶段调用。
+
 ## 📑 Git 提交规范
 
 以下基于 [vue](https://github.com/vuejs/vue/blob/dev/.github/COMMIT_CONVENTION.md#git-commit-message-convention) 提交规范编写

build/plugins.ts

@@ -13,6 +13,9 @@ import { TDesignResolver } from 'unplugin-vue-components/resolvers'
 import Components from 'unplugin-vue-components/vite'
 import { VueRouterAutoImports } from 'unplugin-vue-router'
 import VueRouter from 'unplugin-vue-router/vite'
+import { compression, defineAlgorithm } from 'vite-plugin-compression2'
+import { VitePWA } from 'vite-plugin-pwa'
+import vsharp from 'vite-plugin-vsharp'
 import svgLoader from 'vite-svg-loader'
 
 import { buildInfo } from './info'
@@ -42,27 +45,92 @@ export function usePlugins(): PluginOption[] {
       dts: './types/vue-router.d.ts',
       routesFolder: ['src/views'],
       exclude: [
-        '**/!(index).vue', // 排除非 index.vue 文件
+        '**/components/**/*',
+        '**/composables/**/*',
+        '**/hooks/**/*',
+        '**/shared/**/*',
       ],
     }),
     // i18n 支持
     VueI18nPlugin({
       include: [processPath('../locales/**')],
+      compositionOnly: true,
+      runtimeOnly: true,
+      fullInstall: false,
     }),
     vue(),
     // 支持 JSX 语法
     vueJsx(),
     // 处理 SVG 图标
-    svgLoader(),
+    svgLoader({
+      defaultImport: 'url',
+      svgo: true,
+      svgoConfig: {
+        plugins: [
+          { name: 'removeViewBox', active: false },
+          { name: 'removeDimensions', active: true },
+        ],
+      },
+      include: [/\.svg\?component$/],
+      exclude: [/\/public\//],
+    } as any),
+    // 图片压缩（JPG/PNG/WebP/GIF）
+    vsharp(),
     // TailwindCSS 4 新增
     Tailwindcss(),
-    // 代码定位工具，按住 alt + shift 点击页面上的组件可直接跳转到 vscode 对应代码段哦 😍
-    codeInspectorPlugin({
-      bundler: 'vite',
-      hideConsole: true,
-    }),
+    // 代码定位工具（仅开发启用，生产禁用）
+    process.env.NODE_ENV !== 'production'
+      ? codeInspectorPlugin({
+          bundler: 'vite',
+          hideConsole: true,
+        })
+      : null,
     // 手搓 vite 构建信息 plugin 😎
     buildInfo(),
+    // 预压缩静态资源（仅生产环境）
+    process.env.NODE_ENV === 'production'
+      ? compression({
+          algorithms: [
+            defineAlgorithm('brotliCompress'), // 优先使用brotli算法
+            defineAlgorithm('gzip'), // gzip兜底
+          ],
+          include: /\.(js|mjs|css|html|svg|json|txt|xml|wasm)$/i,
+          threshold: 1024,
+          skipIfLargerOrEqual: true,
+        })
+      : null,
+    // PWA 缓存（仅生产环境生效）
+    VitePWA({
+      registerType: 'autoUpdate',
+      injectRegister: 'auto',
+      manifest: {
+        name: 'tdesign-mobile-vue-starter',
+        short_name: 'tdesign-mobile',
+        theme_color: '#ffffff',
+        background_color: '#ffffff',
+        display: 'standalone',
+        icons: [
+          // 使用已有资源，避免缺少 /public/icons 目录导致 404
+          { src: '/favicon.ico', sizes: '16x16 32x32 48x48 64x64', type: 'image/x-icon' },
+          { src: '/logo.svg', sizes: 'any', type: 'image/svg+xml', purpose: 'any maskable' },
+        ],
+      },
+      workbox: {
+        globPatterns: ['**/*.{js,css,html,svg,png,jpg,jpeg,webp,avif,woff2}'],
+        navigateFallback: '/index.html',
+        clientsClaim: true,
+        skipWaiting: true,
+        maximumFileSizeToCacheInBytes: 8 * 1024 * 1024,
+        runtimeCaching: [
+          {
+            urlPattern: /\/assets\/.*\.(?:png|jpg|jpeg|svg|webp|avif)$/,
+            handler: 'StaleWhileRevalidate',
+            options: { cacheName: 'image-cache', expiration: { maxEntries: 200, maxAgeSeconds: 60 * 60 * 24 * 30 } },
+          },
+        ],
+      },
+      disable: process.env.NODE_ENV !== 'production',
+    }),
     // 打包分析，看看哪个老六最占打包体积 😠
     lifecycle === 'report'
       ? visualizer({ brotliSize: true, open: true, filename: 'report.html' })

docs/.vitepress/config.ts

@@ -0,0 +1,87 @@
+import { defineConfig } from 'vitepress'
+import { navZh, navEn } from './nav'
+import { sidebarZh, sidebarEn } from './sidebar'
+
+export default defineConfig({
+  title: 'TDesign Mobile Starter',
+  description: '企业级、移动端优先的 TDesign Mobile Vue 应用模板',
+  base: '/',
+  lastUpdated: true,
+  ignoreDeadLinks: true,
+  cleanUrls: true,
+  appearance: true,
+  head: [
+    ['link', { rel: 'icon', href: '/favicon.ico' }],
+    ['meta', { name: 'theme-color', content: '#41d1ff' }],
+  ],
+
+  locales: {
+    root: {
+      label: '简体中文',
+      lang: 'zh-CN',
+      themeConfig: {
+        siteTitle: '',
+        logo: '/logo.svg',
+        search: { provider: 'local' },
+        nav: navZh,
+        sidebar: sidebarZh,
+        outline: [2, 4],
+        outlineTitle: '本页导航',
+        docFooter: { prev: '上一页', next: '下一页' },
+        sidebarMenuLabel: '目录',
+        returnToTopLabel: '回到顶部',
+        darkModeSwitchLabel: '外观',
+        lightModeSwitchTitle: '切换到浅色主题',
+        darkModeSwitchTitle: '切换到深色主题',
+        externalLinkIcon: false,
+        lastUpdated: {
+          text: '上次更新',
+          formatOptions: { dateStyle: 'short', timeStyle: 'short' },
+        },
+        socialLinks: [
+          { icon: 'github', link: 'https://github.com/TDesignOteam/tdesign-mobile-vue-starter-community' },
+        ],
+        footer: {
+          message: '基于 TDesign Mobile Vue 构建',
+          copyright: 'Copyright © 2024-2025',
+        },
+      },
+    },
+    en: {
+      label: 'English',
+      lang: 'en-US',
+      link: '/en/',
+      themeConfig: {
+        siteTitle: '',
+        logo: '/logo.svg',
+        search: { provider: 'local' },
+        nav: navEn,
+        sidebar: sidebarEn,
+        outline: [2, 4],
+        outlineTitle: 'On this page',
+        docFooter: { prev: 'Previous', next: 'Next' },
+        sidebarMenuLabel: 'Menu',
+        returnToTopLabel: 'Back to top',
+        darkModeSwitchLabel: 'Appearance',
+        lightModeSwitchTitle: 'Switch to light theme',
+        darkModeSwitchTitle: 'Switch to dark theme',
+        externalLinkIcon: false,
+        editLink: {
+          pattern: 'https://github.com/OWNER/REPO/edit/main/docs/:path',
+          text: 'Edit this page on GitHub',
+        },
+        lastUpdated: {
+          text: 'Last updated',
+          formatOptions: { dateStyle: 'short', timeStyle: 'short' },
+        },
+        socialLinks: [
+          { icon: 'github', link: 'https://github.com/TDesignOteam/tdesign-mobile-vue-starter-community' },
+        ],
+        footer: {
+          message: 'Powered by TDesign Mobile Vue',
+          copyright: 'Copyright © 2024-2025',
+        },
+      },
+    },
+  },
+})

docs/.vitepress/nav.ts

@@ -0,0 +1,12 @@
+export const navZh = [
+  { text: '首页', link: '/' },
+  { text: '指南', link: '/guide/' },
+  { text: '页面', link: '/pages/' },
+]
+
+export const navEn = [
+  { text: 'Home', link: '/en/' },
+  { text: 'Guide', link: '/en/guide/' },
+  { text: 'Pages', link: '/en/pages/' },
+]
+