🚀 fix deploy err and lint and chunk size limit

.eslintignore

@@ -1,6 +1,21 @@
-node_modules
-dist
-build
-coverage
+# 构建文件
+dist/
+build/
+*.min.js
+
+# 依赖
+node_modules/
+
+# 配置文件
+vite.config.ts
+*.config.js
+
+# 类型声明
 *.d.ts
-vite.config.ts 
+
+# 其他
+coverage/
+.vscode/
+.idea/
+.DS_Store
+

.github/workflows/typecheck.yml

@@ -0,0 +1,19 @@
+name: Type Check
+
+on:
+  push:
+    branches: [main]
+  pull_request:
+    branches: [main]
+
+jobs:
+  typecheck:
+    runs-on: ubuntu-latest
+    steps:
+      - uses: actions/checkout@v3
+      - uses: actions/setup-node@v3
+        with:
+          node-version: "18"
+      - run: npm ci
+      - run: npm run typecheck
+      - run: npm run lint

README.md

@@ -23,17 +23,20 @@
 ## 本地运行
 
 1. 克隆项目
+
 ```bash
 git clone https://github.com/lod61/chatgpt-clone.git
 cd chatgpt-clone
 ```
 
 2. 安装依赖
+
 ```bash
 npm install
 ```
 
 3. 启动开发服务器
+
 ```bash
 npm run dev
 ```
@@ -43,11 +46,13 @@ npm run dev
 ## 使用说明
 
 1. 首次使用需要配置 OpenRouter API key
+
    - 访问 [OpenRouter](https://openrouter.ai/keys) 获取 API key
    - 点击界面右上角的设置图标
    - 输入 API key 并保存
 
 2. 开始对话
+
    - 在底部输入框输入消息
    - 按回车键或点击发送按钮发送消息
    - 支持 Shift + Enter 换行
@@ -108,6 +113,7 @@ src/
 ## 部署方案
 
 ### 1. Vercel 部署（推荐）
+
 最简单的部署方式，自动构建和部署：
 
 1. Fork 本项目到你的 GitHub
@@ -116,6 +122,7 @@ src/
 4. 完成部署
 
 ### 2. Docker 部署
+
 ```bash
 # 构建镜像
 docker build -t chatgpt-clone .
@@ -127,6 +134,7 @@ docker run -d -p 3000:80 \
 ```
 
 ### 3. 静态托管
+
 构建后可部署到任何静态托管服务：
 
 ```bash
@@ -142,6 +150,7 @@ npm run build
 ```
 
 ### 4. Node.js 环境部署
+
 ```bash
 # 安装依赖
 npm install

eslint.config.js

@@ -1,13 +1,19 @@
 import eslint from "@eslint/js";
 import tseslint from "@typescript-eslint/eslint-plugin";
 import typescript from "@typescript-eslint/parser";
-import reactHooks from "eslint-plugin-react-hooks";
 import react from "eslint-plugin-react";
+import reactHooks from "eslint-plugin-react-hooks";
 
 export default [
   eslint.configs.recommended,
   {
     files: ["**/*.{ts,tsx}"],
+    ignores: [
+      "vite.config.ts",
+      "dist/**/*",
+      "build/**/*",
+      "node_modules/**/*"
+    ],
     languageOptions: {
       parser: typescript,
       parserOptions: {
@@ -16,6 +22,8 @@ export default [
         ecmaFeatures: {
           jsx: true,
         },
+        project: "./tsconfig.json",
+        tsconfigRootDir: ".",
       },
       globals: {
         window: "readonly",

package.json

@@ -6,10 +6,11 @@
   "scripts": {
     "dev": "vite",
     "build": "tsc --noEmit && vite build",
-    "lint": "eslint .",
-    "lint:fix": "eslint . --fix",
+    "lint": "eslint 'src/**/*.{ts,tsx}'",
+    "lint:fix": "eslint 'src/**/*.{ts,tsx}' --fix",
     "preview": "vite preview",
-    "typecheck": "tsc --noEmit"
+    "typecheck": "tsc --noEmit",
+    "prepare": "husky install"
   },
   "dependencies": {
     "@emotion/react": "^11.11.3",
@@ -37,6 +38,14 @@
     "eslint-plugin-react-hooks": "^5.0.0",
     "eslint-plugin-react-refresh": "^0.4.5",
     "typescript": "^5.2.2",
-    "vite": "^5.0.8"
+    "vite": "^5.0.8",
+    "husky": "^8.0.0",
+    "lint-staged": "^15.0.0"
+  },
+  "lint-staged": {
+    "*.{ts,tsx}": [
+      "eslint --fix",
+      "tsc-files --noEmit"
+    ]
   }
 }

src/components/Chat/ChatContainer.tsx

@@ -1,12 +1,12 @@
-import { useState, useRef, useCallback, useEffect } from "react";
-import { Box, IconButton } from "@mui/material";
-import { Settings as SettingsIcon } from "@mui/icons-material";
+import { useApiKey } from "@/hooks/useApiKey";
+import { streamChat } from "@/services/api";
 import { Message } from "@/types/chat";
+import { Settings as SettingsIcon } from "@mui/icons-material";
+import { Box, IconButton } from "@mui/material";
+import { useCallback, useEffect, useRef, useState } from "react";
+import Settings from "../Settings/Settings";
 import ChatHistory from "./ChatHistory";
 import ChatInput from "./ChatInput";
-import Settings from "../Settings/Settings";
-import { useApiKey } from "@/hooks/useApiKey";
-import { streamChat } from "@/services/api";
 
 export default function ChatContainer() {
   const [messages, setMessages] = useState<Message[]>([]);
@@ -142,7 +142,17 @@ export default function ChatContainer() {
     }
 
     const newMessages = [...messages];
-    newMessages[index] = { ...newMessages[index], content: newContent };
+    const originalMessage = newMessages[index];
+
+    if (!originalMessage) {
+      console.error('Message not found at index:', index);
+      return;
+    }
+
+    newMessages[index] = {
+      role: originalMessage.role,
+      content: newContent
+    };
 
     newMessages.splice(index + 1);
     const aiMessage: Message = { role: "assistant", content: "" };

src/components/Chat/ChatInput.tsx

@@ -1,15 +1,13 @@
-import React, { forwardRef } from "react";
-import { Box, IconButton, InputBase } from "@mui/material";
 import { Send } from "@mui/icons-material";
+import { Box, IconButton, InputBase } from "@mui/material";
+import React, { forwardRef } from "react";
 
 interface ChatInputProps {
   onSend: (message: string) => void;
   disabled?: boolean;
   isGenerating?: boolean;
 }
 
-type KeyboardEventElement = HTMLInputElement | HTMLDivElement;
-
 const ChatInput = forwardRef<HTMLInputElement, ChatInputProps>(
   ({ onSend, disabled, isGenerating }, ref) => {
     const [input, setInput] = React.useState("");
@@ -25,7 +23,9 @@ const ChatInput = forwardRef<HTMLInputElement, ChatInputProps>(
       }
     };
 
-    const handleKeyDown = (e: React.KeyboardEvent<KeyboardEventElement>) => {
+    const handleKeyDown = (
+      e: React.KeyboardEvent<HTMLInputElement | HTMLTextAreaElement>
+    ) => {
       if (e.key === "Enter" && !e.shiftKey && !disabled) {
         e.preventDefault();
         if (input.trim()) {

src/types/utils.ts

@@ -0,0 +1,7 @@
+// 常用类型工具
+export type Nullable<T> = T | null;
+export type Optional<T> = T | undefined;
+export type ValueOf<T> = T[keyof T];
+export type DeepPartial<T> = {
+  [P in keyof T]?: T[P] extends object ? DeepPartial<T[P]> : T[P];
+}; 

tsconfig.json

@@ -23,11 +23,23 @@
     "noUnusedLocals": false,
     "noUnusedParameters": false,
     "noFallthroughCasesInSwitch": true,
-    "types": ["node", "react", "react-dom", "@types/dom-speech-recognition"],
+    "types": ["node", "react", "react-dom"],
     "typeRoots": [
       "./node_modules/@types",
       "./src/types"
-    ]
+    ],
+    "noImplicitAny": true,
+    "strictNullChecks": true,
+    "strictFunctionTypes": true,
+    "strictBindCallApply": true,
+    "strictPropertyInitialization": true,
+    "noImplicitThis": true,
+    "useUnknownInCatchVariables": true,
+    "alwaysStrict": true,
+    "noUncheckedIndexedAccess": true,
+    "noImplicitReturns": true,
+    "noImplicitOverride": true,
+    "allowUnreachableCode": false
   },
   "include": ["src"],
   "references": [{ "path": "./tsconfig.node.json" }]

vite.config.ts

@@ -1,20 +1,24 @@
-import { defineConfig } from 'vite'
 import react from '@vitejs/plugin-react'
-import { fileURLToPath } from 'url'
-import { dirname, resolve } from 'path'
-
-const __filename = fileURLToPath(import.meta.url)
-const __dirname = dirname(__filename)
+import path from 'path'
+import { defineConfig } from 'vite'
 
 export default defineConfig({
-  base: '/chatgpt-clone/',
   plugins: [react()],
   resolve: {
     alias: {
-      '@': resolve(__dirname, './src'),
+      '@': path.resolve(__dirname, './src'),
     },
   },
-  server: {
-    port: 3000,
+  build: {
+    rollupOptions: {
+      output: {
+        manualChunks: {
+          'vendor-react': ['react', 'react-dom', 'react-markdown'],
+          'vendor-mui': ['@mui/material', '@mui/icons-material'],
+          'vendor-highlight': ['react-syntax-highlighter'],
+        },
+      },
+    },
+    chunkSizeWarningLimit: 1000,
   },
 })