Halaman utama Jelajahi Bantuan
Daftar Masuk
154-template-137
/
blank
ter-fork dari d8dfun/blank
2
0
Fork 0
Berkas
Jelajahi Sumber

✨ feat(deps): 集成完整前端技术栈

- 添加 antd 组件库、@tanstack/react-query、axios、react-router-dom 等核心依赖
- 引入 @heroicons/react 图标库和 dayjs 日期处理工具
- 配置 @ 路径别名和 tsconfig paths
- 创建 ClientOnly 组件用于客户端渲染隔离
- 调整客户端入口逻辑，根据路由加载不同模块

📦 build(config): 更新构建配置

- 在 vite.config.ts 中配置 @ 路径别名
- 在 tsconfig.json 中添加 baseUrl 和 paths 配置
yourname 7 bulan lalu
induk
3f2f301c61
melakukan
0e99628012
8 mengubah file dengan 789 tambahan dan 23 penghapusan
Unified View Tampilkan Statistik Diff
  1. 15 12
      index.html
  2. 8 0
      package.json
  3. 725 0
      pnpm-lock.yaml
  4. 5 7
      src/client/index.tsx
  5. 21 0
      src/client/utils/ClientOnly.tsx
  6. 2 2
      src/server/index.tsx
  7. 6 1
      tsconfig.json
  8. 7 1
      vite.config.ts

+ 15 - 12
index.html
Tampilan Berkas 

@@ -1,14 +1,17 @@
 
 <!doctype html>
 
 <!doctype html>
 
 <html lang="en">
 
 <html lang="en">
 
-  <head>
 
-    <meta charset="UTF-8" />
 
-    <link rel="icon" type="image/svg+xml" href="/vite.svg" />
 
-    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
 
-    <title>Vite + React + TS</title>
 
-    <!--app-head-->
 
-  </head>
 
-  <body>
 
-    <div id="root"><!--app-html--></div>
 
-    <script type="module" src="/src/entry-client.tsx"></script>
 
-  </body>
 
-</html>
 
+
 
+<head>
 
+  <meta charset="UTF-8" />
 
+  <link rel="icon" type="image/svg+xml" href="/vite.svg" />
 
+  <meta name="viewport" content="width=device-width, initial-scale=1.0" />
 
+  <title>Vite + React + TS</title>
 
+  <!--app-head-->
 
+</head>
 
+
 
+<body>
 
+  <div id="root"><!--app-html--></div>
 
+  <script type="module" src="/src/client/index.tsx"></script>
 
+</body>
 
+
 
+</html>

+ 8 - 0
package.json
Tampilan Berkas 

@@ -11,13 +11,21 @@
 
     "preview": "PORT=8080 cross-env NODE_ENV=production tsx server"
 
     "preview": "PORT=8080 cross-env NODE_ENV=production tsx server"
 
   },
 
   },
 
   "dependencies": {
 
   "dependencies": {
 
+    "@heroicons/react": "^2.2.0",
 
     "@hono/node-server": "^1.17.1",
 
     "@hono/node-server": "^1.17.1",
 
     "@hono/zod-openapi": "^1.0.2",
 
     "@hono/zod-openapi": "^1.0.2",
 
+    "@tanstack/react-query": "^5.83.0",
 
+    "antd": "^5.26.6",
 
+    "axios": "^1.11.0",
 
     "compression": "^1.8.0",
 
     "compression": "^1.8.0",
 
+    "dayjs": "^1.11.13",
 
     "express": "^5.1.0",
 
     "express": "^5.1.0",
 
     "hono": "^4.8.5",
 
     "hono": "^4.8.5",
 
     "react": "^19.1.0",
 
     "react": "^19.1.0",
 
     "react-dom": "^19.1.0",
 
     "react-dom": "^19.1.0",
 
+    "react-hook-form": "^7.61.1",
 
+    "react-router": "^7.7.0",
 
+    "react-router-dom": "^7.7.0",
 
     "sirv": "^3.0.1"
 
     "sirv": "^3.0.1"
 
   },
 
   },
 
   "devDependencies": {
 
   "devDependencies": {

File diff ditekan karena terlalu besar
+ 725 - 0
pnpm-lock.yaml


+ 5 - 7
src/client/index.tsx
Tampilan Berkas 

@@ -1,8 +1,6 @@
 
 // 如果当前是在 /big 下
 
 // 如果当前是在 /big 下
 
-// if (window.location.pathname.startsWith('/admin')) {
 
-//   import('./admin/index')
 
-// } else {
 
-//   import('./home/index')
 
-// }
 
-
 
-import('./home/index')
 
+if (window.location.pathname.startsWith('/admin')) {
 
+  import('./admin/index')
 
+} else {
 
+  import('./home/index')
 
+}

+ 21 - 0
src/client/utils/ClientOnly.tsx
Tampilan Berkas 

@@ -0,0 +1,21 @@
 
+// components/ClientOnly.tsx
 
+import { useEffect, useState, ReactNode } from 'react';
 
+
 
+interface ClientOnlyProps {
 
+  // 子组件（仅在客户端渲染）
 
+  children: ReactNode;
 
+  // 服务器端渲染时的占位内容（可选，默认 null）
 
+  fallback?: ReactNode | null;
 
+}
 
+
 
+export default function ClientOnly({ children, fallback = null }: ClientOnlyProps) {
 
+  const [isClient, setIsClient] = useState<boolean>(false);
 
+
 
+  useEffect(() => {
 
+    // 仅在客户端执行，标记为客户端环境
 
+    setIsClient(true);
 
+  }, []);
 
+
 
+  // 服务器端渲染时显示 fallback，客户端渲染时显示 children
 
+  return isClient ? children : fallback;
 
+}

+ 2 - 2
src/server/index.tsx
Tampilan Berkas 

@@ -3,12 +3,12 @@ import {
 
   type RenderToPipeableStreamOptions,
 
   type RenderToPipeableStreamOptions,
 
   renderToPipeableStream,
 
   renderToPipeableStream,
 
 } from 'react-dom/server'
 
 } from 'react-dom/server'
 
-import App from '../App'
 
+// import App from '../App'
 
 
 
 export function render(_url: string, options?: RenderToPipeableStreamOptions) {
 
 export function render(_url: string, options?: RenderToPipeableStreamOptions) {
 
   return renderToPipeableStream(
 
   return renderToPipeableStream(
 
     <StrictMode>
 
     <StrictMode>
 
-      <App />
 
+      {/* <App /> */}
 
     </StrictMode>,
 
     </StrictMode>,
 
     options,
 
     options,
 
   )
 
   )

+ 6 - 1
tsconfig.json
Tampilan Berkas 

@@ -19,7 +19,12 @@
 
     "noUnusedLocals": true,
 
     "noUnusedLocals": true,
 
     "noUnusedParameters": true,
 
     "noUnusedParameters": true,
 
     "noFallthroughCasesInSwitch": true,
 
     "noFallthroughCasesInSwitch": true,
 
-    "noUncheckedSideEffectImports": true
 
+    "noUncheckedSideEffectImports": true,
 
+    
+    "baseUrl": ".",
 
+    "paths": {
 
+      "@/*": ["src/*"]
 
+    },
 
   },
 
   },
 
   "include": ["src"],
 
   "include": ["src"],
 
   "references": [{ "path": "./tsconfig.node.json" }]
 
   "references": [{ "path": "./tsconfig.node.json" }]

+ 7 - 1
vite.config.ts
Tampilan Berkas 

@@ -6,5 +6,11 @@ export default defineConfig({
 
   plugins: [react()],
 
   plugins: [react()],
 
   server: {
 
   server: {
 
     allowedHosts:true
 
     allowedHosts:true
 
-  }
 
+  },
 
+  // 配置 @ 别名
 
+  resolve: {
 
+    alias: {
 
+      '@': '/src',
 
+    },
 
+  },
 
 })
 
 })

Beberapa file tidak ditampilkan karena terlalu banyak file yang berubah dalam diff ini