refactor: 重构 Tailwind 配置以支持模块化和共享主题

- 更新 components.json，修改 CSS 文件路径为 src/styles/shell.css。 - 移除 tailwind.config.js 中的冗余配置，改为导入 tailwind.shell.config.js。 - 新增 tailwind.pages.config.js 和 tailwind.shared.js，集中管理主题和样式配置。 - 更新多个组件以使用新的样式类和配置，提升代码一致性和可维护性。
2026-06-30 23:15:35 +08:00
parent 17a4dbd8a7
commit 6975e38f79
24 changed files with 236 additions and 87 deletions
@@ -3,31 +3,43 @@ import type { PageType } from '@/types/storage';

 type PageModule = { default: ComponentType };

-export function loadPage(key: PageType): Promise<PageModule> {
-  switch (key) {
-    case 'dashboard':
-      return import('@/config/pageLoaders/dashboard').then((m) => m.default());
-    case 'timestamp':
-      return import('@/config/pageLoaders/timestamp').then((m) => m.default());
-    case 'storageCleaner':
-      return import('@/config/pageLoaders/storageCleaner').then((m) => m.default());
-    case 'qrCode':
-      return import('@/config/pageLoaders/qrCode').then((m) => m.default());
-    case 'textStatistics':
-      return import('@/config/pageLoaders/textStatistics').then((m) => m.default());
-    case 'jwt':
-      return import('@/config/pageLoaders/jwt').then((m) => m.default());
-    case 'jsonTools':
-      return import('@/config/pageLoaders/jsonTools').then((m) => m.default());
-    case 'base64Converter':
-      return import('@/config/pageLoaders/base64Converter').then((m) => m.default());
-    case 'rightClickRestorer':
-      return import('@/config/pageLoaders/rightClickRestorer').then((m) => m.default());
-    case 'testDataGenerator':
-      return import('@/config/pageLoaders/testDataGenerator').then((m) => m.default());
-    default: {
-      const _exhaustive: never = key;
-      return Promise.reject(new Error(`Unknown page: ${String(_exhaustive)}`));
-    }
+let pagesStylesLoaded = false;
+
+function ensurePagesStyles(): Promise<unknown> {
+  if (pagesStylesLoaded) {
+    return Promise.resolve();
  }
+  pagesStylesLoaded = true;
+  return import('@/styles/pages.css');
+}
+
+export function loadPage(key: PageType): Promise<PageModule> {
+  return ensurePagesStyles().then(() => {
+    switch (key) {
+      case 'dashboard':
+        return import('@/config/pageLoaders/dashboard').then((m) => m.default());
+      case 'timestamp':
+        return import('@/config/pageLoaders/timestamp').then((m) => m.default());
+      case 'storageCleaner':
+        return import('@/config/pageLoaders/storageCleaner').then((m) => m.default());
+      case 'qrCode':
+        return import('@/config/pageLoaders/qrCode').then((m) => m.default());
+      case 'textStatistics':
+        return import('@/config/pageLoaders/textStatistics').then((m) => m.default());
+      case 'jwt':
+        return import('@/config/pageLoaders/jwt').then((m) => m.default());
+      case 'jsonTools':
+        return import('@/config/pageLoaders/jsonTools').then((m) => m.default());
+      case 'base64Converter':
+        return import('@/config/pageLoaders/base64Converter').then((m) => m.default());
+      case 'rightClickRestorer':
+        return import('@/config/pageLoaders/rightClickRestorer').then((m) => m.default());
+      case 'testDataGenerator':
+        return import('@/config/pageLoaders/testDataGenerator').then((m) => m.default());
+      default: {
+        const _exhaustive: never = key;
+        return Promise.reject(new Error(`Unknown page: ${String(_exhaustive)}`));
+      }
+    }
+  });
 }