chore: version 2.7.1

.env

@@ -2,3 +2,6 @@
 VITE_GLOB_API_URL=/api
 
 VITE_APP_API_BASE_URL=http://localhost:3002/
+
+# Glob API Timeout (ms)
+VITE_GLOB_API_TIMEOUT=100000

.github/workflows/build_docker.yml

@@ -3,8 +3,6 @@ name: build_docker
 on:
   push:
     branches: [main]
-  release:
-    types: [created] # 表示在创建新的 Release 时触发
 
 jobs:
   build_docker:
@@ -13,11 +11,11 @@ jobs:
     steps:
       - name: Checkout
         uses: actions/checkout@v3
-
+      - name: Docker meta
-      - run: |
+        id: meta
-          echo "本次构建的版本为：${GITHUB_REF_NAME} (但是这个变量目前上下文中无法获取到)"
+        uses: docker/metadata-action@v4
-          echo 本次构建的版本为：${{ github.ref_name }}
+        with:
-          env
+          images: chenzhaoyu94/chatgpt-web
 
       - name: Set up QEMU
         uses: docker/setup-qemu-action@v2
@@ -34,8 +32,6 @@ jobs:
         with:
           context: .
           push: true
+          tags: ${{ steps.meta.outputs.tags }}
           labels: ${{ steps.meta.outputs.labels }}
           platforms: linux/amd64,linux/arm64
-          tags: |
-            ${{ secrets.DOCKERHUB_USERNAME }}/chatgpt-web:${{ github.ref_name }}
-            ${{ secrets.DOCKERHUB_USERNAME }}/chatgpt-web:latest

.vscode/settings.json

@@ -29,14 +29,8 @@
     "dockerhub",
     "esno",
     "GPTAPI",
-    "highlightjs",
-    "hljs",
     "iconify",
-    "katex",
-    "katexmath",
-    "linkify",
     "logprobs",
-    "mdhljs",
     "nodata",
     "OPENAI",
     "pinia",
@@ -44,21 +38,11 @@
     "rushstack",
     "Sider",
     "tailwindcss",
-    "traptitech",
     "tsup",
     "Typecheck",
     "unplugin",
     "VITE",
     "vueuse",
     "Zhao"
-  ],
+  ]
-  "i18n-ally.enabledParsers": [
-    "ts"
-  ],
-  "i18n-ally.sortKeys": true,
-  "i18n-ally.keepFulfilled": true,
-  "i18n-ally.localesPaths": [
-    "src/locales"
-  ],
-  "i18n-ally.keystyle": "nested"
 }

CHANGELOG.md

@@ -1,131 +1,3 @@
-## v2.9.3
-
-`2023-03-06`
-
-## Enhancement
-- 感谢 [ChandlerVer5](https://github.com/Chanzhaoyu/chatgpt-web/pull/305) 使用 `markdown-it` 替换 `marked`，解决代码块闪烁的问题
-- 感谢 [shansing](https://github.com/Chanzhaoyu/chatgpt-web/pull/277) 改善文档
-- 感谢 [nalf3in](https://github.com/Chanzhaoyu/chatgpt-web/pull/293) 添加英文翻译
-
-## BugFix
-- 感谢[sepcnt ](https://github.com/Chanzhaoyu/chatgpt-web/pull/279) 修复切换记录时编辑状态未关闭的问题
-- 修复复制代码的兼容性报错问题
-- 修复部分优化小问题
-
-## v2.9.2
-
-`2023-03-04`
-
-手动部署的同学，务必删除根目录和`service`中的`node_modules`重新安装依赖，降低出现问题的概率，自动部署的不需要做改动。
-
-### Feature
-- 感谢 [hyln9](https://github.com/Chanzhaoyu/chatgpt-web/pull/247) 添加对渲染 `LaTex` 数学公式的支持
-- 感谢 [ottocsb](https://github.com/Chanzhaoyu/chatgpt-web/pull/227) 添加支持 `webAPP` (苹果添加到主页书签访问)支持
-- 添加 `OPENAI_API_BASE_URL` 可选环境变量[#249]
-## Enhancement
-- 优化在高分屏上主题内容的最大宽度[#257]
-- 现在文字按单词截断[#215][#225]
-### BugFix
-- 修复动态生成时代码块不能被复制的问题[#251][#260]
-- 修复 `iOS` 移动端输入框不会被键盘顶起的问题[#256]
-- 修复控制台渲染警告
-## Other
-- 更新依赖至最新
-- 修改 `README` 内容
-
-## v2.9.1
-
-`2023-03-02`
-
-### Feature
-- 代码块添加当前代码语言显示和复制功能[#197][#196]
-- 完善多语言，现在可以切换中英文显示
-
-## Enhancement
-- 由[Zo3i](https://github.com/Chanzhaoyu/chatgpt-web/pull/187) 完善 `docker-compose` 部署文档
-
-### BugFix
-- 由 [ottocsb](https://github.com/Chanzhaoyu/chatgpt-web/pull/200) 修复头像修改不同步的问题
-## Other
-- 更新依赖至最新
-- 修改 `README` 内容
-## v2.9.0
-
-`2023-03-02`
-
-### Feature
-- 现在能复制带格式的消息文本
-- 新设计的设定页面，可以自定义姓名、描述、头像（链接方式）
-- 新增`403`和`404`页面以便扩展
-
-## Enhancement
-- 更新 `chatgpt` 使 `ChatGPTAPI` 支持 `gpt-3.5-turbo-0301`（默认）
-- 取消了前端超时限制设定
-
-## v2.8.3
-
-`2023-03-01`
-
-### Feature
-- 消息已输出内容不会因为中断而消失[#167]
-- 添加复制消息按钮[#133]
-
-### Other
-- `README` 添加声明内容
-
-## v2.8.2
-
-`2023-02-28`
-### Enhancement
-- 代码主题调整为 `One Dark - light|dark` 适配深色模式
-### BugFix
-- 修复普通文本代码渲染和深色模式下的问题[#139][#154]
-
-## v2.8.1
-
-`2023-02-27`
-
-### BugFix
-- 修复 `API` 版本不是 `Markdown` 时，普通 `HTML` 代码会被渲染的问题 [#146]
-
-## v2.8.0
-
-`2023-02-27`
-
-- 感谢 [puppywang](https://github.com/Chanzhaoyu/chatgpt-web/commit/628187f5c3348bda0d0518f90699a86525d19018) 修复了 `2.7.0` 版本中关于流输出数据的问题（使用 `nginx` 需要自行配置 `octet-stream` 相关内容）
-
-- 关于为什么使用 `octet-stream` 而不是 `sse`，是因为更好的兼容之前的模式。
-
-- 建议更新到此版本获得比较完整的体验
-
-### Enhancement
-- 优化了部份代码和类型提示
-- 输入框添加换行提示
-- 移动端输入框现在回车为换行，而不是直接提交
-- 移动端双击标题返回顶部，箭头返回底部
-
-### BugFix
-- 流输出数据下的问题[#122]
-- 修复了 `API Key` 下部份代码不换行的问题
-- 修复移动端深色模式部份样式问题[#123][#126]
-- 修复主题模式图标不一致的问题[#126]
-
-## v2.7.3
-
-`2023-02-25`
-
-### Feature
-- 适配系统深色模式 [#118](https://github.com/Chanzhaoyu/chatgpt-web/issues/103)
-### BugFix
-- 修复用户消息能被渲染为 `HTML` 问题 [#117](https://github.com/Chanzhaoyu/chatgpt-web/issues/117)
-
-## v2.7.2
-
-`2023-02-24`
-### Enhancement
-- 消息使用 [github-markdown-css](https://www.npmjs.com/package/github-markdown-css) 进行美化，现在支持全语法
-- 移除测试无用函数
-
 ## v2.7.1
 
 `2023-02-23`

CONTRIBUTING.en.md

@@ -1,49 +0,0 @@
-# Contribution Guide
-Thank you for your valuable time. Your contributions will make this project better! Before submitting a contribution, please take some time to read the getting started guide below.
-
-## Semantic Versioning
-This project follows semantic versioning. We release patch versions for important bug fixes, minor versions for new features or non-important changes, and major versions for significant and incompatible changes.
-
-Each major change will be recorded in the `changelog`.
-
-## Submitting Pull Request
-1. Fork [this repository](https://github.com/Chanzhaoyu/chatgpt-web) and create a branch from `main`. For new feature implementations, submit a pull request to the `feature` branch. For other changes, submit to the `main` branch.
-2. Install the `pnpm` tool using `npm install pnpm -g`.
-3. Install the `Eslint` plugin for `VSCode`, or enable `eslint` functionality for other editors such as `WebStorm`.
-4. Execute `pnpm bootstrap` in the root directory.
-5. Execute `pnpm install` in the `/service/` directory.
-6. Make changes to the codebase. If applicable, ensure that appropriate testing has been done.
-7. Execute `pnpm lint:fix` in the root directory to perform a code formatting check.
-8. Execute `pnpm type-check` in the root directory to perform a type check.
-9. Submit a git commit, following the [Commit Guidelines](#commit-guidelines).
-10. Submit a `pull request`. If there is a corresponding `issue`, please link it using the [linking-a-pull-request-to-an-issue keyword](https://docs.github.com/en/issues/tracking-your-work-with-issues/linking-a-pull-request-to-an-issue#linking-a-pull-request-to-an-issue-using-a-keyword).
-
-## Commit Guidelines
-
-Commit messages should follow the [conventional-changelog standard](https://www.conventionalcommits.org/en/v1.0.0/):
-
-```bash
-<type>[optional scope]: <description>
-
-[optional body]
-
-[optional footer]
-```
-
-### Commit Types
-
-The following is a list of commit types:
-
-- feat: New feature or functionality
-- fix: Bug fix
-- docs: Documentation update
-- style: Code style or component style update
-- refactor: Code refactoring, no new features or bug fixes introduced
-- perf: Performance optimization
-- test: Unit test
-- chore: Other commits that do not modify src or test files
-
-
-## License
-
-[MIT](./license)

README.en.md

@@ -1,312 +0,0 @@
-# ChatGPT Web
-
-<div style="font-size: 1.5rem;">
-  <a href="./README.md">中文</a> |
-  <a href="./README.en.md">English</a>
-</div>
-</br>
-
-> Disclaimer: This project is only released on GitHub, under the MIT License, free and for open-source learning purposes. There will be no account selling, paid services, discussion groups, or forums. Beware of fraud.
-
-![cover](./docs/c1.png)
-![cover2](./docs/c2.png)
-
-- [ChatGPT Web](#chatgpt-web)
-	- [Introduction](#introduction)
-	- [Roadmap](#roadmap)
-	- [Prerequisites](#prerequisites)
-		- [Node](#node)
-		- [PNPM](#pnpm)
-		- [Fill in the Keys](#fill-in-the-keys)
-	- [Install Dependencies](#install-dependencies)
-		- [Backend](#backend)
-		- [Frontend](#frontend)
-	- [Run in Test Environment](#run-in-test-environment)
-		- [Backend Service](#backend-service)
-		- [Frontend Webpage](#frontend-webpage)
-	- [Packaging](#packaging)
-		- [Using Docker](#using-docker)
-			- [Docker Parameter Example](#docker-parameter-example)
-			- [Docker Build \& Run](#docker-build--run)
-			- [Docker Compose](#docker-compose)
-		- [Deployment with Railway](#deployment-with-railway)
-			- [Railway Environment Variables](#railway-environment-variables)
-		- [Manual packaging](#manual-packaging)
-			- [Backend service](#backend-service-1)
-			- [Frontend webpage](#frontend-webpage-1)
-	- [Frequently Asked Questions](#frequently-asked-questions)
-	- [Contributing](#contributing)
-	- [Sponsorship](#sponsorship)
-	- [License](#license)
-
-## Introduction
-
-Supports dual models, provides two unofficial `ChatGPT API` methods:
-
-| Method                                        | Free?  | Reliability | Quality |
-| --------------------------------------------- | ------ | ----------- | ------- |
-| `ChatGPTAPI(gpt-3.5-turbo-0301)`                           | No     | Reliable    | Relatively clumsy |
-| `ChatGPTUnofficialProxyAPI(Web accessToken)` | Yes    | Relatively unreliable | Smart |
-
-Comparison:
-1. `ChatGPTAPI` uses `gpt-3.5-turbo-0301` to simulate `ChatGPT` through the official `OpenAI` completion `API` (the most reliable method, but it is not free and does not use models specifically tuned for chat).
-2. `ChatGPTUnofficialProxyAPI` accesses `ChatGPT`'s backend `API` via an unofficial proxy server to bypass `Cloudflare` (uses the real `ChatGPT`, is very lightweight, but depends on third-party servers and has rate limits).
-
-[Details](https://github.com/Chanzhaoyu/chatgpt-web/issues/138)
-
-Switching Methods:
-1. Go to the `service/.env` file.
-2. For `OpenAI API Key`, fill in the `OPENAI_API_KEY` field [(Get apiKey)](https://platform.openai.com/overview).
-3. For `Web API`, fill in the `OPENAI_ACCESS_TOKEN` field [(Get accessToken)](https://chat.openai.com/api/auth/session).
-4. When both are present, `OpenAI API Key` takes precedence.
-
-Reverse Proxy:
-
-Available when using `ChatGPTUnofficialProxyAPI`.[Details](https://github.com/transitive-bullshit/chatgpt-api#reverse-proxy)
-
-```shell
-# service/.env
-API_REVERSE_PROXY=
-```
-
-Environment Variables:
-
-For all parameter variables, check [here](#docker-parameter-example) or see:
-
-```
-/service/.env
-```
-
-## Roadmap
-[✓] Dual models
-
-[✓] Multiple session storage and context logic
-
-[✓] Formatting and beautifying code-like message types
-
-[✓] Multilingual interface
-
-[✓] Interface themes
-
-[✗] More...
-
-## Prerequisites
-
-### Node
-
-`node` requires version `^16 || ^18` (`node >= 14` requires installation of [fetch polyfill](https://github.com/developit/unfetch#usage-as-a-polyfill)), and multiple local `node` versions can be managed using [nvm](https://github.com/nvm-sh/nvm).
-
-```shell
-node -v
-```
-
-### PNPM
-If you have not installed `pnpm` before:
-```shell
-npm install pnpm -g
-```
-
-### Fill in the Keys
-
-Get `Openai Api Key` or `accessToken` and fill in the local environment variables [jump](#introduction)
-
-```
-# service/.env file
-
-# OpenAI API Key - https://platform.openai.com/overview
-OPENAI_API_KEY=
-
-# change this to an `accessToken` extracted from the ChatGPT site's `https://chat.openai.com/api/auth/session` response
-OPENAI_ACCESS_TOKEN=
-```
-
-## Install Dependencies
-
-> To make it easier for `backend developers` to understand, we did not use the front-end `workspace` mode, but stored it in different folders. If you only need to do secondary development of the front-end page, delete the `service` folder.
-
-### Backend
-
-Enter the `/service` folder and run the following command
-
-```shell
-pnpm install
-```
-
-### Frontend
-Run the following command in the root directory
-```shell
-pnpm bootstrap
-```
-
-## Run in Test Environment
-### Backend Service
-
-Enter the `/service` folder and run the following command
-
-```shell
-pnpm start
-```
-
-### Frontend Webpage
-Run the following command in the root directory
-```shell
-pnpm dev
-```
-
-## Packaging
-
-### Using Docker
-
-#### Docker Parameter Example
-
-- `OPENAI_API_KEY` one of two
-- `OPENAI_ACCESS_TOKEN` one of two, `OPENAI_API_KEY` takes precedence when both are present
-- `OPENAI_API_BASE_URL` optional, available when `OPENAI_API_KEY` is set
-- `API_REVERSE_PROXY` optional, available when `OPENAI_ACCESS_TOKEN` is set [Reference](#introduction)
-- `TIMEOUT_MS` timeout, in milliseconds, optional
-- `SOCKS_PROXY_HOST` optional, effective with SOCKS_PROXY_PORT
-- `SOCKS_PROXY_PORT` optional, effective with SOCKS_PROXY_HOST
-
-![docker](./docs/docker.png)
-
-#### Docker Build & Run
-
-```bash
-docker build -t chatgpt-web .
-
-# foreground operation
-docker run --name chatgpt-web --rm -it -p 3002:3002 --env OPENAI_API_KEY=your_api_key chatgpt-web
-
-# background operation
-docker run --name chatgpt-web -d -p 3002:3002 --env OPENAI_API_KEY=your_api_key chatgpt-web
-
-# running address
-http://localhost:3002/
-```
-
-#### Docker Compose
-
-[Hub Address](https://hub.docker.com/repository/docker/chenzhaoyu94/chatgpt-web/general)
-
-```yml
-version: '3'
-
-services:
-  app:
-    image: chenzhaoyu94/chatgpt-web # always use latest, pull the tag image again when updating
-    ports:
-      - 3002:3002
-    environment:
-      # one of two
-      OPENAI_API_KEY: xxxxxx
-      # one of two
-      OPENAI_ACCESS_TOKEN: xxxxxx
-      # api interface url, optional, available when OPENAI_API_KEY is set
-      OPENAI_API_BASE_URL: xxxx
-      # reverse proxy, optional
-      API_REVERSE_PROXY: xxx
-      # timeout, in milliseconds, optional
-      TIMEOUT_MS: 60000
-      # socks proxy, optional, effective with SOCKS_PROXY_PORT
-      SOCKS_PROXY_HOST: xxxx
-      # socks proxy port, optional, effective with SOCKS_PROXY_HOST
-      SOCKS_PROXY_PORT: xxxx
-```
-The `OPENAI_API_BASE_URL` is optional and only used when setting the `OPENAI_API_KEY`.
-
-### Deployment with Railway
-
-[![Deploy on Railway](https://railway.app/button.svg)](https://railway.app/new/template/yytmgc)
-
-#### Railway Environment Variables
-
-| Environment Variable | Required | Description                                                                                       |
-| -------------------- | -------- | ------------------------------------------------------------------------------------------------- |
-| `PORT`               | Required | Default: `3002`                                                                                   |
-| `TIMEOUT_MS`         | Optional | Timeout in milliseconds.                                                                          |
-| `OPENAI_API_KEY`     | Optional | Required for `OpenAI API`. `apiKey` can be obtained from [here](https://platform.openai.com/overview). |
-| `OPENAI_ACCESS_TOKEN`| Optional | Required for `Web API`. `accessToken` can be obtained from [here](https://chat.openai.com/api/auth/session).|
-| `OPENAI_API_BASE_URL`  | Optional, only for `OpenAI API` |  API endpoint.                                                        |
-| `API_REVERSE_PROXY`  | Optional, only for `Web API` | Reverse proxy address for `Web API`. [Details](https://github.com/transitive-bullshit/chatgpt-api#reverse-proxy) |
-| `SOCKS_PROXY_HOST`   | Optional, effective with `SOCKS_PROXY_PORT` | Socks proxy.                      |
-| `SOCKS_PROXY_PORT`   | Optional, effective with `SOCKS_PROXY_HOST` | Socks proxy port.                 |
-
-> Note: Changing environment variables in Railway will cause re-deployment.
-
-### Manual packaging
-
-#### Backend service
-
-> If you don't need the `node` interface of this project, you can skip the following steps.
-
-Copy the `service` folder to a server that has a `node` service environment.
-
-```shell
-# Install
-pnpm install
-
-# Build
-pnpm build
-
-# Run
-pnpm prod
-```
-
-PS: You can also run `pnpm start` directly on the server without packaging.
-
-#### Frontend webpage
-
-1. Modify `VITE_APP_API_BASE_URL` in `.env` at the root directory to your actual backend interface address.
-2. Run the following command in the root directory and then copy the files in the `dist` folder to the root directory of your website service.
-
-[Reference information](https://cn.vitejs.dev/guide/static-deploy.html#building-the-app)
-
-```shell
-pnpm build
-```
-
-## Frequently Asked Questions
-
-Q: Why does Git always report an error when committing?
-
-A: Because there is submission information verification, please follow the [Commit Guidelines](./CONTRIBUTING.en.md).
-
-Q: Where to change the request interface if only the frontend page is used?
-
-A: The `VITE_GLOB_API_URL` field in the `.env` file at the root directory.
-
-Q: All red when saving the file?
-
-A: For `vscode`, please install the recommended plug-in of the project or manually install the `Eslint` plug-in.
-
-Q: Why doesn't the frontend have a typewriter effect?
-
-A: One possible reason is that after Nginx reverse proxying, buffering is turned on, and Nginx will try to buffer a certain amount of data from the backend before sending it to the browser. Please try adding `proxy_buffering off;` after the reverse proxy parameter and then reloading Nginx. Other web server configurations are similar.
-
-## Contributing
-
-Please read the [Contributing Guidelines](./CONTRIBUTING.en.md) before contributing.
-
-Thanks to all the contributors!
-
-<a href="https://github.com/Chanzhaoyu/chatgpt-web/graphs/contributors">
-  <img src="https://contrib.rocks/image?repo=Chanzhaoyu/chatgpt-web" />
-</a>
-
-## Sponsorship
-
-If you find this project helpful and circumstances permit, you can give me a little support. Thank you very much for your support~
-
-<div style="display: flex; gap: 20px;">
-	<div style="text-align: center">
-		<img style="max-width: 100%" src="./docs/wechat.png" alt="WeChat" />
-		<p>WeChat Pay</p>
-	</div>
-	<div style="text-align: center">
-		<img style="max-width: 100%" src="./docs/alipay.png" alt="Alipay" />
-		<p>Alipay</p>
-	</div>
-</div>
-
-## License
-MIT © [ChenZhaoYu](./license)

README.md

@@ -1,15 +1,9 @@
 # ChatGPT Web
 
-<div style="font-size: 1.5rem;">
+> 使用 `express` 和 `vue3` 搭建的支持 `ChatGPT` 双模型演示网页
-  <a href="./README.md">中文</a> |
-  <a href="./README.en.md">English</a>
-</div>
-</br>
 
-> 声明：此项目只发布于 Github，基于 MIT 协议，免费且作为开源学习使用。并且不会有任何形式的卖号、付费服务、讨论群、讨论组等行为。谨防受骗。
+![cover](./docs/cover.png)
-
+![cover2](./docs/cover2.png)
-![cover](./docs/c1.png)
-![cover2](./docs/c2.png)
 
 - [ChatGPT Web](#chatgpt-web)
 	- [介绍](#介绍)
@@ -36,23 +30,22 @@
 			- [前端网页](#前端网页-1)
 	- [常见问题](#常见问题)
 	- [参与贡献](#参与贡献)
-	- [赞助](#赞助)
 	- [License](#license)
 ## 介绍
 
 支持双模型，提供了两种非官方 `ChatGPT API` 方法
 
-| 方式                                          | 免费？ | 可靠性     | 质量 |
+|  方式   | 免费？  | 可靠性  | 质量 |
-| --------------------------------------------- | ------ | ---------- | ---- |
+|  ----  | ----  | ----  | ----  |
-| `ChatGPTAPI(gpt-3.5-turbo-0301)`                           | 否     | 可靠       | 相对较笨 |
+| `ChatGPTAPI(GPT-3)`  | 否 | 	可靠 | 较笨 |
-| `ChatGPTUnofficialProxyAPI(网页 accessToken)` | 是     | 相对不可靠 | 聪明 |
+| `ChatGPTUnofficialProxyAPI(网页 accessToken)`  | 	是 |  不可靠 | 聪明 |
+
+***Note:*** 网页 `accessToken` 存在大约 8 小时，而且国内地区网络问题更推荐使用 `GPT-3` 的方式
 
 对比：
-1. `ChatGPTAPI` 使用 `gpt-3.5-turbo-0301` 通过官方`OpenAI`补全`API`模拟`ChatGPT`（最稳健的方法，但它不是免费的，并且没有使用针对聊天进行微调的模型）
+1. `ChatGPTAPI` 使用 `text-davinci-003` 通过官方`OpenAI`补全`API`模拟`ChatGPT`（最稳健的方法，但它不是免费的，并且没有使用针对聊天进行微调的模型）
 2. `ChatGPTUnofficialProxyAPI` 使用非官方代理服务器访问 `ChatGPT` 的后端`API`，绕过`Cloudflare`（使用真实的的`ChatGPT`，非常轻量级，但依赖于第三方服务器，并且有速率限制）
 
-[查看详情](https://github.com/Chanzhaoyu/chatgpt-web/issues/138)
-
 切换方式：
 1. 进入 `service/.env` 文件
 2. 使用 `OpenAI API Key` 请填写 `OPENAI_API_KEY` 字段 [(获取 apiKey)](https://platform.openai.com/overview)
@@ -61,21 +54,13 @@
 
 反向代理：
 
-`ChatGPTUnofficialProxyAPI`时可用，[详情](https://github.com/transitive-bullshit/chatgpt-api#reverse-proxy)
+`ChatGPTUnofficialProxyAPI`时可用 [详情](https://github.com/transitive-bullshit/chatgpt-api#reverse-proxy)
 
 ```shell
 # service/.env
 API_REVERSE_PROXY=
 ```
 
-环境变量：
-
-全部参数变量请查看或[这里](#docker-参数示例)
-
-```
-/service/.env
-```
-
 ## 待实现路线
 [✓] 双模型
 
@@ -83,9 +68,9 @@ API_REVERSE_PROXY=
 
 [✓] 对代码等消息类型的格式化美化处理
 
-[✓] 界面多语言
+[✗] 界面多语言
 
-[✓] 界面主题
+[✗] 界面主题
 
 [✗] More...
 
@@ -159,11 +144,8 @@ pnpm dev
 
 - `OPENAI_API_KEY` 二选一
 - `OPENAI_ACCESS_TOKEN`  二选一，同时存在时，`OPENAI_API_KEY` 优先
-- `OPENAI_API_BASE_URL`  可选，设置 `OPENAI_API_KEY` 时可用
 - `API_REVERSE_PROXY` 可选，设置 `OPENAI_ACCESS_TOKEN` 时可用 [参考](#介绍)
 - `TIMEOUT_MS` 超时，单位毫秒，可选
-- `SOCKS_PROXY_HOST` 可选，和 SOCKS_PROXY_PORT 一起时生效
-- `SOCKS_PROXY_PORT` 可选，和 SOCKS_PROXY_HOST 一起时生效
 
 ![docker](./docs/docker.png)
 
@@ -191,7 +173,7 @@ version: '3'
 
 services:
   app:
-    image: chenzhaoyu94/chatgpt-web # 总是使用 latest ,更新时重新 pull 该 tag 镜像即可
+    image: chenzhaoyu94/chatgpt-web:main
     ports:
       - 3002:3002
     environment:
@@ -199,34 +181,25 @@ services:
       OPENAI_API_KEY: xxxxxx
       # 二选一
       OPENAI_ACCESS_TOKEN: xxxxxx
-      # API接口地址，可选，设置 OPENAI_API_KEY 时可用
-      OPENAI_API_BASE_URL: xxxx
       # 反向代理，可选
       API_REVERSE_PROXY: xxx
       # 超时，单位毫秒，可选
       TIMEOUT_MS: 60000
-      # Socks代理，可选，和 SOCKS_PROXY_PORT 一起时生效
-      SOCKS_PROXY_HOST: xxxx
-      # Socks代理端口，可选，和 SOCKS_PROXY_HOST 一起时生效
-      SOCKS_PROXY_PORT: xxxx
 ```
-- `OPENAI_API_BASE_URL`  可选，设置 `OPENAI_API_KEY` 时可用
+
 ###  使用 Railway 部署
 
 [![Deploy on Railway](https://railway.app/button.svg)](https://railway.app/new/template/yytmgc)
 
 #### Railway 环境变量
 
-| 环境变量名称          | 必填                   | 备注                                                                                               |
+| 环境变量名称                | 必填 | 备注                    |
-| --------------------- | ---------------------- | -------------------------------------------------------------------------------------------------- |
+| --------------------------- | ---- | ----------------------- |
-| `PORT`                | 必填                   | 默认 `3002`                                                                                        |
+| `PORT` | 必填    | 默认 `3002`  |
-| `TIMEOUT_MS`          | 可选                   | 超时时间，单位毫秒，                                                                               |
+| `TIMEOUT_MS` | 可选    | 超时时间，单位毫秒，   |
-| `OPENAI_API_KEY`      | `OpenAI API` 二选一    | 使用 `OpenAI API` 所需的 `apiKey` [(获取 apiKey)](https://platform.openai.com/overview)            |
+| `OPENAI_API_KEY` | `OpenAI API` 二选一    | 使用 `OpenAI API` 所需的 `apiKey` [(获取 apiKey)](https://platform.openai.com/overview)   |
-| `OPENAI_ACCESS_TOKEN` | `Web API` 二选一       | 使用 `Web API` 所需的 `accessToken` [(获取 accessToken)](https://chat.openai.com/api/auth/session) |
+| `OPENAI_ACCESS_TOKEN` | `Web API` 二选一   | 使用 `Web API` 所需的 `accessToken` [(获取 accessToken)](https://chat.openai.com/api/auth/session)   |
-| `OPENAI_API_BASE_URL`   | 可选，`OpenAI API` 时可用 |  `API`接口地址  |
+| `API_REVERSE_PROXY` | 可选，`Web API` 时可用    | `Web API` 反向代理地址 [详情](https://github.com/transitive-bullshit/chatgpt-api#reverse-proxy)   |
-| `API_REVERSE_PROXY`   | 可选，`Web API` 时可用 | `Web API` 反向代理地址 [详情](https://github.com/transitive-bullshit/chatgpt-api#reverse-proxy)    |
-| `SOCKS_PROXY_HOST`   | 可选，和 `SOCKS_PROXY_PORT` 一起时生效 | Socks代理    |
-| `SOCKS_PROXY_PORT`   | 可选，和 `SOCKS_PROXY_HOST` 一起时生效 | Socks代理端口    |
 
 > 注意: `Railway` 修改环境变量会重新 `Deploy`
 
@@ -274,10 +247,6 @@ Q: 文件保存时全部爆红?
 
 A: `vscode` 请安装项目推荐插件，或手动安装 `Eslint` 插件。
 
-Q: 前端没有打字机效果？
-
-A: 一种可能原因是经过 Nginx 反向代理，开启了 buffer，则 Nginx 会尝试从后端缓冲一定大小的数据再发送给浏览器。请尝试在反代参数后添加 `proxy_buffering off;`，然后重载 Nginx。其他 web server 配置同理。
-
 ## 参与贡献
 
 贡献之前请先阅读 [贡献指南](./CONTRIBUTING.md)
@@ -288,20 +257,5 @@ A: 一种可能原因是经过 Nginx 反向代理，开启了 buffer，则 Nginx
   <img src="https://contrib.rocks/image?repo=Chanzhaoyu/chatgpt-web" />
 </a>
 
-## 赞助
-
-如果你觉得这个项目对你有帮助，并且情况允许的话，可以给我一点点支持，总之非常感谢支持～
-
-<div style="display: flex; gap: 20px;">
-	<div style="text-align: center">
-		<img style="max-width: 100%" src="./docs/wechat.png" alt="微信" />
-		<p>WeChat Pay</p>
-	</div>
-	<div style="text-align: center">
-		<img style="max-width: 100%" src="./docs/alipay.png" alt="支付宝" />
-		<p>Alipay</p>
-	</div>
-</div>
-
 ## License
 MIT © [ChenZhaoYu](./license)

config/proxy.ts

@@ -6,9 +6,9 @@ export function createViteProxy(isOpenProxy: boolean, viteEnv: ImportMetaEnv) {
 
   const proxy: Record<string, string | ProxyOptions> = {
     '/api': {
-      target: viteEnv.VITE_APP_API_BASE_URL,
+      target: viteEnv.VITE_GLOB_API_URL,
       changeOrigin: true,
-      rewrite: path => path.replace('/api/', '/'),
+      rewrite: path => path.replace(/^\/api/, ''),
     },
   }
 

docker-compose/docker-compose.yml

@@ -1,33 +0,0 @@
-version: '3'
-
-services:
-  app:
-    image: chenzhaoyu94/chatgpt-web # 总是使用latest,更新时重新pull该tag镜像即可
-    ports:
-      - 3002:3002
-    environment:
-      # 二选一
-      OPENAI_API_KEY: xxxx
-      # 二选一
-      OPENAI_ACCESS_TOKEN: xxxxxx
-      # API接口地址，可选，设置 OPENAI_API_KEY 时可用
-      OPENAI_API_BASE_URL: xxxx
-      # 反向代理，可选
-      API_REVERSE_PROXY: xxx
-      # 超时，单位毫秒，可选
-      TIMEOUT_MS: 60000
-      # Socks代理，可选，和 SOCKS_PROXY_PORT 一起时生效
-      SOCKS_PROXY_HOST: xxxx
-      # Socks代理端口，可选，和 SOCKS_PROXY_HOST 一起时生效
-      SOCKS_PROXY_PORT: xxxx
-  nginx:
-    build: nginx
-    image: chatgpt/nginx
-    ports:
-      - '80:80'
-    expose:
-      - '80'
-    volumes:
-      - ./nginx/html/:/etc/nginx/html/
-    links:
-      - app

docker-compose/nginx/Dockerfile

@@ -1,10 +0,0 @@
-FROM hub.c.163.com/library/nginx
-
-MAINTAINER jo "tionsin@live.com"
-
-RUN rm -rf /etc/nginx/conf.d/default.conf
-COPY ./nginx.conf /etc/nginx/conf.d/default.conf
-COPY ./html/ /usr/share/nginx/html/
-EXPOSE 80
-
-CMD ["nginx", "-g", "daemon off;"]

docker-compose/nginx/nginx.conf

@@ -1,20 +0,0 @@
-server {
-	listen 80;
-	server_name  localhost;
-	charset utf-8;
-	error_page   500 502 503 504  /50x.html;
-	location = / {
-			root   /usr/share/nginx/html;
-			index  index.html index.htm;
-	}
-
-	location /api {
-			proxy_set_header   X-Real-IP $remote_addr; #转发用户IP
-			proxy_pass http://app:3002;
-	}
-
-	proxy_set_header Host $host;
-	proxy_set_header X-Real-IP $remote_addr;
-	proxy_set_header REMOTE-HOST $remote_addr;
-	proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
-}

docker-compose/readme.md

@@ -1,15 +0,0 @@
-### docker-compose 部署教程
-- 将打包好的前端文件放到 `nginx/html` 目录下
-- ```shell
-  # 打包启动
-  docker-compose build
-  docker-compose up -d
-  ```
-- ```shell
-  # 查看运行状态
-  docker ps
-  ```
-- ```shell
-  # 结束运行
-  docker-compose down
-  ```

index.html

@@ -1,16 +1,15 @@
 <!DOCTYPE html>
 <html lang="zh-cmn-Hans">
+
 <head>
 	<meta charset="UTF-8">
 	<link rel="icon" type="image/svg+xml" href="/favicon.svg">
-	<meta content="yes" name="apple-mobile-web-app-capable"/>
-	<link rel="apple-touch-icon" href="/favicon.ico">
 	<meta name="viewport"
 		content="width=device-width, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0, viewport-fit=cover" />
 	<title>ChatGPT Web</title>
 </head>
 
-<body class="dark:bg-black">
+<body>
 	<div id="app">
 		<style>
 			.loading-wrap {
@@ -62,12 +61,6 @@
 					transform: translateX(100%);
 				}
 			}
-
-			@media (prefers-color-scheme: dark) {
-				body {
-					background: #121212;
-				}
-			}
 		</style>
 		<div class="loading-wrap">
 			<div class="balls">

package.json

@@ -1,6 +1,6 @@
 {
   "name": "chatgpt-web",
-  "version": "2.9.3",
+  "version": "2.7.1",
   "private": false,
   "description": "ChatGPT Web",
   "author": "ChenZhaoYu <chenzhaoyu1994@gmail.com>",
@@ -23,41 +23,38 @@
     "common:prepare": "husky install"
   },
   "dependencies": {
-    "@traptitech/markdown-it-katex": "^3.6.0",
     "@vueuse/core": "^9.13.0",
     "highlight.js": "^11.7.0",
-    "katex": "^0.16.4",
+    "marked": "^4.2.12",
-    "markdown-it": "^13.0.1",
     "naive-ui": "^2.34.3",
-    "pinia": "^2.0.32",
+    "pinia": "^2.0.30",
     "vue": "^3.2.47",
-    "vue-i18n": "^9.2.2",
     "vue-router": "^4.1.6"
   },
   "devDependencies": {
-    "@antfu/eslint-config": "^0.35.3",
+    "@antfu/eslint-config": "^0.35.2",
     "@commitlint/cli": "^17.4.4",
     "@commitlint/config-conventional": "^17.4.4",
     "@iconify/vue": "^4.1.0",
     "@types/crypto-js": "^4.1.1",
-    "@types/katex": "^0.16.0",
+    "@types/marked": "^4.0.8",
-    "@types/markdown-it": "^12.2.3",
+    "@types/node": "^18.14.0",
-    "@types/node": "^18.14.6",
+    "@types/web-bluetooth": "^0.0.16",
     "@vitejs/plugin-vue": "^4.0.0",
     "autoprefixer": "^10.4.13",
-    "axios": "^1.3.4",
+    "axios": "^1.3.3",
     "crypto-js": "^4.1.1",
-    "eslint": "^8.35.0",
+    "eslint": "^8.34.0",
     "husky": "^8.0.3",
     "less": "^4.1.3",
     "lint-staged": "^13.1.2",
     "npm-run-all": "^4.1.5",
     "postcss": "^8.4.21",
-    "rimraf": "^4.2.0",
+    "rimraf": "^4.1.2",
     "tailwindcss": "^3.2.7",
     "typescript": "~4.9.5",
-    "vite": "^4.1.4",
+    "vite": "^4.1.2",
-    "vue-tsc": "^1.2.0"
+    "vue-tsc": "^1.1.4"
   },
   "lint-staged": {
     "*.{ts,tsx,vue}": [

service/.env

@@ -4,17 +4,8 @@ OPENAI_API_KEY=
 # change this to an `accessToken` extracted from the ChatGPT site's `https://chat.openai.com/api/auth/session` response
 OPENAI_ACCESS_TOKEN=
 
-# OpenAI API Base URL - https://api.openai.com
-OPENAI_API_BASE_URL=
-
 # Reverse Proxy
 API_REVERSE_PROXY=
 
 # timeout
-TIMEOUT_MS=100000
+TIMEOUT_MS=60000
-
-# Socks Proxy Host
-SOCKS_PROXY_HOST=
-
-# Socks Proxy Port
-SOCKS_PROXY_PORT=

service/package.json

@@ -24,20 +24,18 @@
     "common:cleanup": "rimraf node_modules && rimraf pnpm-lock.yaml"
   },
   "dependencies": {
-    "chatgpt": "^5.0.7",
+    "chatgpt": "^4.7.2",
     "dotenv": "^16.0.3",
     "esno": "^0.16.3",
     "express": "^4.18.2",
-    "isomorphic-fetch": "^3.0.0",
+    "isomorphic-fetch": "^3.0.0"
-    "node-fetch": "^3.3.0",
-    "socks-proxy-agent": "^7.0.0"
   },
   "devDependencies": {
-    "@antfu/eslint-config": "^0.35.3",
+    "@antfu/eslint-config": "^0.35.2",
     "@types/express": "^4.17.17",
-    "@types/node": "^18.14.6",
+    "@types/node": "^18.14.0",
-    "eslint": "^8.35.0",
+    "eslint": "^8.34.0",
-    "rimraf": "^4.3.0",
+    "rimraf": "^4.1.2",
     "tsup": "^6.6.3",
     "typescript": "^4.9.5"
   }

service/src/chatgpt.ts

@@ -0,0 +1,110 @@
+import * as dotenv from 'dotenv'
+import 'isomorphic-fetch'
+import type { ChatGPTAPI, ChatMessage, SendMessageOptions } from 'chatgpt'
+import { ChatGPTUnofficialProxyAPI } from 'chatgpt'
+import { sendResponse } from './utils'
+
+dotenv.config()
+
+let apiModel: 'ChatGPTAPI' | 'ChatGPTUnofficialProxyAPI' | undefined
+
+interface ChatContext {
+  conversationId?: string
+  parentMessageId?: string
+}
+
+const timeoutMs: number = !isNaN(+process.env.TIMEOUT_MS) ? +process.env.TIMEOUT_MS : 30 * 1000
+
+if (!process.env.OPENAI_API_KEY && !process.env.OPENAI_ACCESS_TOKEN)
+  throw new Error('Missing OPENAI_API_KEY or OPENAI_ACCESS_TOKEN environment variable')
+
+let api: ChatGPTAPI | ChatGPTUnofficialProxyAPI
+
+// To use ESM in CommonJS, you can use a dynamic import
+(async () => {
+  // More Info: https://github.com/transitive-bullshit/chatgpt-api
+  const { ChatGPTAPI } = await import('chatgpt')
+
+  if (process.env.OPENAI_API_KEY) {
+    api = new ChatGPTAPI({ apiKey: process.env.OPENAI_API_KEY })
+    apiModel = 'ChatGPTAPI'
+  }
+  else {
+    let options = {}
+
+    if (process.env.API_REVERSE_PROXY)
+      options = { apiReverseProxyUrl: process.env.API_REVERSE_PROXY }
+
+    api = new ChatGPTUnofficialProxyAPI({
+      accessToken: process.env.OPENAI_ACCESS_TOKEN,
+      ...options,
+    })
+    apiModel = 'ChatGPTUnofficialProxyAPI'
+  }
+})()
+
+async function chatReply(
+  message: string,
+  lastContext?: { conversationId?: string; parentMessageId?: string },
+) {
+  if (!message)
+    return sendResponse({ type: 'Fail', message: 'Message is empty' })
+
+  try {
+    let options: SendMessageOptions = { timeoutMs }
+
+    if (lastContext)
+      options = { ...lastContext }
+
+    const response = await api.sendMessage(message, { ...options })
+
+    return sendResponse({ type: 'Success', data: response })
+  }
+  catch (error: any) {
+    return sendResponse({ type: 'Fail', message: error.message })
+  }
+}
+
+/**  实验性质的函数，用于处理聊天过程中的中间结果 */
+async function chatReplyProcess(
+  message: string,
+  lastContext?: { conversationId?: string; parentMessageId?: string },
+  process?: (chat: ChatMessage) => void,
+) {
+  if (!message)
+    return sendResponse({ type: 'Fail', message: 'Message is empty' })
+
+  try {
+    let options: SendMessageOptions = { timeoutMs }
+
+    if (lastContext)
+      options = { ...lastContext }
+
+    const response = await api.sendMessage(message, {
+      ...options,
+      onProgress: (partialResponse) => {
+        process?.(partialResponse)
+      },
+    })
+
+    return sendResponse({ type: 'Success', data: response })
+  }
+  catch (error: any) {
+    return sendResponse({ type: 'Fail', message: error.message })
+  }
+}
+
+async function chatConfig() {
+  return sendResponse({
+    type: 'Success',
+    data: {
+      apiModel,
+      reverseProxy: process.env.API_REVERSE_PROXY,
+      timeoutMs,
+    },
+  })
+}
+
+export type { ChatContext, ChatMessage }
+
+export { chatReply, chatReplyProcess, chatConfig }

service/src/chatgpt/index.ts

@@ -1,120 +0,0 @@
-import * as dotenv from 'dotenv'
-import 'isomorphic-fetch'
-import type { ChatGPTAPIOptions, ChatMessage, SendMessageOptions } from 'chatgpt'
-import { ChatGPTAPI, ChatGPTUnofficialProxyAPI } from 'chatgpt'
-import { SocksProxyAgent } from 'socks-proxy-agent'
-import fetch from 'node-fetch'
-import { sendResponse } from '../utils'
-import type { ApiModel, ChatContext, ChatGPTUnofficialProxyAPIOptions, ModelConfig } from '../types'
-
-dotenv.config()
-
-const timeoutMs: number = !isNaN(+process.env.TIMEOUT_MS) ? +process.env.TIMEOUT_MS : 30 * 1000
-
-let apiModel: ApiModel
-
-if (!process.env.OPENAI_API_KEY && !process.env.OPENAI_ACCESS_TOKEN)
-  throw new Error('Missing OPENAI_API_KEY or OPENAI_ACCESS_TOKEN environment variable')
-
-let api: ChatGPTAPI | ChatGPTUnofficialProxyAPI
-
-(async () => {
-  // More Info: https://github.com/transitive-bullshit/chatgpt-api
-
-  if (process.env.OPENAI_API_KEY) {
-    const options: ChatGPTAPIOptions = {
-      apiKey: process.env.OPENAI_API_KEY,
-      completionParams: {
-        model: 'gpt-3.5-turbo',
-      },
-      debug: false,
-    }
-
-    if (process.env.OPENAI_API_BASE_URL && process.env.OPENAI_API_BASE_URL.trim().length > 0)
-      options.apiBaseUrl = process.env.OPENAI_API_BASE_URL
-
-    if (process.env.SOCKS_PROXY_HOST && process.env.SOCKS_PROXY_PORT) {
-      const agent = new SocksProxyAgent({
-        hostname: process.env.SOCKS_PROXY_HOST,
-        port: process.env.SOCKS_PROXY_PORT,
-      })
-      options.fetch = (url, options) => {
-        return fetch(url, { agent, ...options })
-      }
-    }
-
-    api = new ChatGPTAPI({ ...options })
-    apiModel = 'ChatGPTAPI'
-  }
-  else {
-    const options: ChatGPTUnofficialProxyAPIOptions = {
-      accessToken: process.env.OPENAI_ACCESS_TOKEN,
-      debug: false,
-    }
-
-    if (process.env.SOCKS_PROXY_HOST && process.env.SOCKS_PROXY_PORT) {
-      const agent = new SocksProxyAgent({
-        hostname: process.env.SOCKS_PROXY_HOST,
-        port: process.env.SOCKS_PROXY_PORT,
-      })
-      options.fetch = (url, options) => {
-        return fetch(url, { agent, ...options })
-      }
-    }
-
-    if (process.env.API_REVERSE_PROXY)
-      options.apiReverseProxyUrl = process.env.API_REVERSE_PROXY
-
-    api = new ChatGPTUnofficialProxyAPI({ ...options })
-    apiModel = 'ChatGPTUnofficialProxyAPI'
-  }
-})()
-
-async function chatReplyProcess(
-  message: string,
-  lastContext?: { conversationId?: string; parentMessageId?: string },
-  process?: (chat: ChatMessage) => void,
-) {
-  if (!message)
-    return sendResponse({ type: 'Fail', message: 'Message is empty' })
-
-  try {
-    let options: SendMessageOptions = { timeoutMs }
-
-    if (lastContext) {
-      if (apiModel === 'ChatGPTAPI')
-        options = { parentMessageId: lastContext.parentMessageId }
-      else
-        options = { ...lastContext }
-    }
-
-    const response = await api.sendMessage(message, {
-      ...options,
-      onProgress: (partialResponse) => {
-        process?.(partialResponse)
-      },
-    })
-
-    return sendResponse({ type: 'Success', data: response })
-  }
-  catch (error: any) {
-    global.console.error(error)
-    return sendResponse({ type: 'Fail', message: error.message })
-  }
-}
-
-async function chatConfig() {
-  return sendResponse({
-    type: 'Success',
-    data: {
-      apiModel,
-      reverseProxy: process.env.API_REVERSE_PROXY,
-      timeoutMs,
-      socksProxy: (process.env.SOCKS_PROXY_HOST && process.env.SOCKS_PROXY_PORT) ? (`${process.env.SOCKS_PROXY_HOST}:${process.env.SOCKS_PROXY_PORT}`) : '-',
-    } as ModelConfig,
-  })
-}
-
-export type { ChatContext, ChatMessage }
-
-export { chatReplyProcess, chatConfig }

service/src/index.ts

@@ -1,6 +1,6 @@
 import express from 'express'
 import type { ChatContext, ChatMessage } from './chatgpt'
-import { chatConfig, chatReplyProcess } from './chatgpt'
+import { chatConfig, chatReply, chatReplyProcess } from './chatgpt'
 
 const app = express()
 const router = express.Router()
@@ -15,15 +15,25 @@ app.all('*', (_, res, next) => {
   next()
 })
 
+router.post('/chat', async (req, res) => {
+  try {
+    const { prompt, options = {} } = req.body as { prompt: string; options?: ChatContext }
+    const response = await chatReply(prompt, options)
+    res.send(response)
+  }
+  catch (error) {
+    res.send(error)
+  }
+})
+
+/**  实验性质的函数，用于处理聊天过程中的中间结果 */
 router.post('/chat-process', async (req, res) => {
   res.setHeader('Content-type', 'application/octet-stream')
 
   try {
     const { prompt, options = {} } = req.body as { prompt: string; options?: ChatContext }
-    let firstChunk = true
     await chatReplyProcess(prompt, options, (chat: ChatMessage) => {
-      res.write(firstChunk ? JSON.stringify(chat) : `\n${JSON.stringify(chat)}`)
+      res.write(JSON.stringify(chat))
-      firstChunk = false
     })
   }
   catch (error) {

service/src/types.ts

@@ -1,24 +0,0 @@
-import type { FetchFn } from 'chatgpt'
-
-export interface ChatContext {
-  conversationId?: string
-  parentMessageId?: string
-}
-
-export interface ChatGPTUnofficialProxyAPIOptions {
-  accessToken: string
-  apiReverseProxyUrl?: string
-  model?: string
-  debug?: boolean
-  headers?: Record<string, string>
-  fetch?: FetchFn
-}
-
-export interface ModelConfig {
-  apiModel?: ApiModel
-  reverseProxy?: string
-  timeoutMs?: number
-  socksProxy?: string
-}
-
-export type ApiModel = 'ChatGPTAPI' | 'ChatGPTUnofficialProxyAPI' | undefined

src/App.vue

@@ -1,20 +1,10 @@
 <script setup lang="ts">
 import { NConfigProvider } from 'naive-ui'
 import { NaiveProvider } from '@/components/common'
-import { useTheme } from '@/hooks/useTheme'
-import { useLanguage } from '@/hooks/useLanguage'
-
-const { theme, themeOverrides } = useTheme()
-const { language } = useLanguage()
 </script>
 
 <template>
-  <NConfigProvider
+  <NConfigProvider class="h-full">
-    class="h-full"
-    :theme="theme"
-    :theme-overrides="themeOverrides"
-    :locale="language"
-  >
     <NaiveProvider>
       <RouterView />
     </NaiveProvider>

src/api/index.ts

@@ -13,12 +13,7 @@ export function fetchChatAPI<T = any>(
   })
 }
 
-export function fetchChatConfig<T = any>() {
+/**  实验性质的函数，用于处理聊天过程中的中间结果 */
-  return post<T>({
-    url: '/config',
-  })
-}
-
 export function fetchChatAPIProcess<T = any>(
   params: {
     prompt: string
@@ -33,3 +28,9 @@ export function fetchChatAPIProcess<T = any>(
     onDownloadProgress: params.onDownloadProgress,
   })
 }
+
+export function fetchChatConfig<T = any>() {
+  return post<T>({
+    url: '/config',
+  })
+}

src/components/business/index.ts

@@ -0,0 +1 @@
+export { }

src/components/common/HoverButton/Button.vue

@@ -12,7 +12,7 @@ function handleClick() {
 
 <template>
   <button
-    class="flex items-center justify-center w-10 h-10 transition rounded-full hover:bg-neutral-100 dark:hover:bg-[#414755]"
+    class="flex items-center justify-center w-10 h-10 transition rounded-full hover:bg-neutral-100"
     @click="handleClick"
   >
     <slot />

src/components/common/Setting/About.vue

@@ -1,62 +0,0 @@
-<script setup lang='ts'>
-import { onMounted, ref } from 'vue'
-import { NSpin } from 'naive-ui'
-import { fetchChatConfig } from '@/api'
-import pkg from '@/../package.json'
-
-interface ConfigState {
-  timeoutMs?: number
-  reverseProxy?: string
-  apiModel?: string
-  socksProxy?: string
-}
-
-const loading = ref(false)
-
-const config = ref<ConfigState>()
-
-async function fetchConfig() {
-  try {
-    loading.value = true
-    const { data } = await fetchChatConfig<ConfigState>()
-    config.value = data
-  }
-  finally {
-    loading.value = false
-  }
-}
-
-onMounted(() => {
-  fetchConfig()
-})
-</script>
-
-<template>
-  <NSpin :show="loading">
-    <div class="p-4 space-y-4">
-      <h2 class="text-xl font-bold">
-        Version - {{ pkg.version }}
-      </h2>
-      <div class="p-2 space-y-2 rounded-md bg-neutral-100 dark:bg-neutral-700">
-        <p>
-          此项目开源于
-          <a
-            class="text-blue-600 dark:text-blue-500"
-            href="https://github.com/Chanzhaoyu/chatgpt-web"
-            target="_blank"
-          >
-            Github
-          </a>
-          ，免费且基于 MIT 协议，没有任何形式的付费行为！
-        </p>
-        <p>
-          如果你觉得此项目对你有帮助，请在 Github 帮我点个 Star 或者给予一点赞助，谢谢！
-        </p>
-      </div>
-      <p>{{ $t("setting.api") }}：{{ config?.apiModel ?? '-' }}</p>
-      <p>{{ $t("setting.reverseProxy") }}：{{ config?.reverseProxy ?? '-' }}</p>
-      <p>{{ $t("setting.timeout") }}：{{ config?.timeoutMs ?? '-' }}</p>
-      <p>{{ $t("setting.socks") }}：{{ config?.socksProxy ?? '-' }}</p>
-    </div>
-  </NSpin>
-</template>

src/components/common/Setting/General.vue

@@ -1,145 +0,0 @@
-<script lang="ts" setup>
-import { computed, ref } from 'vue'
-import { NButton, NInput, useMessage } from 'naive-ui'
-import type { Language, Theme } from '@/store/modules/app/helper'
-import { SvgIcon } from '@/components/common'
-import { useAppStore, useUserStore } from '@/store'
-import type { UserInfo } from '@/store/modules/user/helper'
-import { t } from '@/locales'
-
-interface Emit {
-  (event: 'update'): void
-}
-
-const emit = defineEmits<Emit>()
-
-const appStore = useAppStore()
-const userStore = useUserStore()
-
-const ms = useMessage()
-
-const theme = computed(() => appStore.theme)
-
-const userInfo = computed(() => userStore.userInfo)
-
-const avatar = ref(userInfo.value.avatar ?? '')
-
-const name = ref(userInfo.value.name ?? '')
-
-const description = ref(userInfo.value.description ?? '')
-
-const language = computed({
-  get() {
-    return appStore.language
-  },
-  set(value: Language) {
-    appStore.setLanguage(value)
-  },
-})
-
-const themeOptions: { label: string; key: Theme; icon: string }[] = [
-  {
-    label: 'Auto',
-    key: 'auto',
-    icon: 'ri:contrast-line',
-  },
-  {
-    label: 'Light',
-    key: 'light',
-    icon: 'ri:sun-foggy-line',
-  },
-  {
-    label: 'Dark',
-    key: 'dark',
-    icon: 'ri:moon-foggy-line',
-  },
-]
-
-const languageOptions: { label: string; key: Language; value: Language }[] = [
-  { label: '中文', key: 'zh-CN', value: 'zh-CN' },
-  { label: 'English', key: 'en-US', value: 'en-US' },
-]
-
-function updateUserInfo(options: Partial<UserInfo>) {
-  userStore.updateUserInfo(options)
-  ms.success(t('common.success'))
-}
-
-function handleReset() {
-  userStore.resetUserInfo()
-  ms.success(t('common.success'))
-  emit('update')
-}
-</script>
-
-<template>
-  <div class="p-4 space-y-5 min-h-[200px]">
-    <div class="space-y-6">
-      <div class="flex items-center space-x-4">
-        <span class="flex-shrink-0 w-[100px]">{{ $t('setting.avatarLink') }}</span>
-        <div class="flex-1">
-          <NInput v-model:value="avatar" placeholder="" />
-        </div>
-        <NButton size="tiny" text type="primary" @click="updateUserInfo({ avatar })">
-          {{ $t('common.save') }}
-        </NButton>
-      </div>
-      <div class="flex items-center space-x-4">
-        <span class="flex-shrink-0 w-[100px]">{{ $t('setting.name') }}</span>
-        <div class="w-[200px]">
-          <NInput v-model:value="name" placeholder="" />
-        </div>
-        <NButton size="tiny" text type="primary" @click="updateUserInfo({ name })">
-          {{ $t('common.save') }}
-        </NButton>
-      </div>
-      <div class="flex items-center space-x-4">
-        <span class="flex-shrink-0 w-[100px]">{{ $t('setting.description') }}</span>
-        <div class="flex-1">
-          <NInput v-model:value="description" placeholder="" />
-        </div>
-        <NButton size="tiny" text type="primary" @click="updateUserInfo({ description })">
-          {{ $t('common.save') }}
-        </NButton>
-      </div>
-      <div class="flex items-center space-x-4">
-        <span class="flex-shrink-0 w-[100px]">{{ $t('setting.resetUserInfo') }}</span>
-        <NButton text type="primary" @click="handleReset">
-          {{ $t('common.reset') }}
-        </NButton>
-      </div>
-      <div class="flex items-center space-x-4">
-        <span class="flex-shrink-0 w-[100px]">{{ $t('setting.theme') }}</span>
-        <div class="flex items-center space-x-4">
-          <template v-for="item of themeOptions" :key="item.key">
-            <a
-              class="flex items-center justify-center h-8 px-4 border rounded-md cursor-pointer dark:border-neutral-700"
-              :class="item.key === theme && ['bg-[#4ca85e]', 'border-[#4ca85e]', 'text-white']"
-              @click="appStore.setTheme(item.key)"
-            >
-              <span class="text-xl">
-                <SvgIcon :icon="item.icon" />
-              </span>
-            </a>
-          </template>
-        </div>
-      </div>
-      <div class="flex items-center space-x-4">
-        <span class="flex-shrink-0 w-[100px]">{{ $t('setting.language') }}</span>
-        <div class="flex items-center space-x-4">
-          <template v-for="item of languageOptions" :key="item.key">
-            <a
-              class="flex items-center justify-center h-8 px-4 border rounded-md cursor-pointer dark:border-neutral-700"
-              :class="item.key === language && ['bg-[#4ca85e]', 'border-[#4ca85e]', 'text-white']"
-              @click="appStore.setLanguage(item.key)"
-            >
-              <span class="text-sm">
-                {{ item.label }}
-              </span>
-            </a>
-          </template>
-        </div>
-      </div>
-    </div>
-  </div>
-</template>

src/components/common/Setting/index.vue

@@ -1,13 +1,8 @@
 <script setup lang='ts'>
-import { computed, ref } from 'vue'
+import { computed, ref, watch } from 'vue'
-import { NCard, NModal, NTabPane, NTabs } from 'naive-ui'
+import { NCard, NModal } from 'naive-ui'
-import General from './General.vue'
+import pkg from '../../../../package.json'
-import About from './About.vue'
+import { fetchChatConfig } from '@/api'
-import { SvgIcon } from '@/components/common'
-
-const props = defineProps<Props>()
-
-const emit = defineEmits<Emit>()
 
 interface Props {
   visible: boolean
@@ -17,9 +12,15 @@ interface Emit {
   (e: 'update:visible', visible: boolean): void
 }
 
-const active = ref('General')
+interface ConfigState {
+  timeoutMs?: number
+  reverseProxy?: string
+  apiModel?: string
+}
 
-const reload = ref(false)
+const props = defineProps<Props>()
+
+const emit = defineEmits<Emit>()
 
 const show = computed({
   get() {
@@ -30,35 +31,45 @@ const show = computed({
   },
 })
 
-function handleReload() {
+const config = ref<ConfigState>()
-  reload.value = true
+
-  setTimeout(() => {
+async function fetchConfig() {
-    reload.value = false
+  try {
-  }, 0)
+    const { data } = await fetchChatConfig<ConfigState>()
+    config.value = data
+  }
+  catch (error) {
+    // ...
+  }
 }
+
+watch(
+  () => props.visible,
+  (val) => {
+    if (val)
+      fetchConfig()
+  },
+)
 </script>
 
 <template>
-  <NModal v-model:show="show" :auto-focus="false">
+  <NModal v-model:show="show" style="width: 80%; max-width: 460px;">
-    <NCard role="dialog" aria-modal="true" :bordered="false" style="width: 100%; max-width: 640px">
+    <NCard>
-      <NTabs v-model:value="active" type="line" animated>
+      <div class="space-y-4">
-        <NTabPane name="General" tab="General">
+        <h2 class="text-xl font-bold text-center">
-          <template #tab>
+          Version - {{ pkg.version }}
-            <SvgIcon class="text-lg" icon="ri:file-user-line" />
+        </h2>
-            <span class="ml-2">{{ $t('setting.general') }}</span>
+        <hr>
-          </template>
+        <p>
-          <div class="min-h-[100px]">
+          此项目开源于
-            <General v-if="!reload" @update="handleReload" />
+          <a class="text-blue-600" href="https://github.com/Chanzhaoyu/chatgpt-web" target="_blank">Github</a>
-          </div>
+          ，免费并且协议为 MIT，其他来源均为盗版，使用时请注意。如果你觉得此项目对你有帮助，请帮我点个 Star，谢谢！
-        </NTabPane>
+        </p>
-        <NTabPane name="Config" tab="Config">
+        <hr>
-          <template #tab>
+        <p>API方式：{{ config?.apiModel ?? '-' }}</p>
-            <SvgIcon class="text-lg" icon="ri:list-settings-line" />
+        <p>反向代理：{{ config?.reverseProxy ?? '-' }}</p>
-            <span class="ml-2">{{ $t('setting.config') }}</span>
+        <p>超时时间：{{ config?.timeoutMs ?? '-' }}</p>
-          </template>
+      </div>
-          <About />
-        </NTabPane>
-      </NTabs>
     </NCard>
   </NModal>
 </template>

src/components/common/UserAvatar/index.vue

@@ -1,39 +1,18 @@
 <script setup lang='ts'>
-import { computed } from 'vue'
+import { GithubSite } from '@/components/custom'
-import { NAvatar } from 'naive-ui'
-import { useUserStore } from '@/store'
-import defaultAvatar from '@/assets/avatar.jpg'
-import { isString } from '@/utils/is'
-
-const userStore = useUserStore()
-
-const userInfo = computed(() => userStore.userInfo)
 </script>
 
 <template>
   <div class="flex items-center">
     <div class="w-10 h-10 overflow-hidden rounded-full">
-      <template v-if="isString(userInfo.avatar) && userInfo.avatar.length > 0">
+      <img class="object-cover" src="@/assets/avatar.jpg" alt="avatar">
-        <NAvatar
-          size="large"
-          round
-          :src="userInfo.avatar"
-          :fallback-src="defaultAvatar"
-        />
-      </template>
-      <template v-else>
-        <NAvatar size="large" round :src="defaultAvatar" />
-      </template>
     </div>
     <div class="ml-2">
       <h2 class="font-bold text-md">
-        {{ userInfo.name ?? 'ChenZhaoYu' }}
+        ChenZhaoYu
       </h2>
       <p class="text-xs text-gray-500">
-        <span
+        <GithubSite />
-          v-if="isString(userInfo.description) && userInfo.description !== ''"
-          v-html="userInfo.description"
-        />
       </p>
     </div>
   </div>

src/components/custom/GithubSite.vue

@@ -1,6 +1,6 @@
 <template>
-  <div class="text-neutral-400">
+  <div class="text-center text-neutral-500">
-    <span>Star on</span>
+    <span>❤️ Star on</span>
     <a href="https://github.com/Chanzhaoyu/chatgpt-bot" target="_blank" class="text-blue-500">
       GitHub
     </a>

src/directives/highlight.ts

@@ -0,0 +1,23 @@
+import type { App, Directive } from 'vue'
+import hljs from 'highlight.js'
+import includeCode from '@/utils/functions/includeCode'
+
+hljs.configure({ ignoreUnescapedHTML: true })
+
+function highlightCode(el: HTMLElement) {
+  if (includeCode(el.textContent))
+    hljs.highlightBlock(el)
+}
+
+export default function setupHighlightDirective(app: App) {
+  const highLightDirective: Directive<HTMLElement> = {
+    mounted(el: HTMLElement) {
+      highlightCode(el)
+    },
+    updated(el: HTMLElement) {
+      highlightCode(el)
+    },
+  }
+
+  app.directive('highlight', highLightDirective)
+}

src/directives/index.ts

@@ -0,0 +1,6 @@
+import type { App } from 'vue'
+import setupHighlightDirective from './highlight'
+
+export function setupDirectives(app: App) {
+  setupHighlightDirective(app)
+}

src/hooks/useIconRender.ts

@@ -1,36 +0,0 @@
-import { h } from 'vue'
-import { SvgIcon } from '@/components/common'
-
-export const useIconRender = () => {
-  interface IconConfig {
-    icon?: string
-    color?: string
-    fontSize?: number
-  }
-
-  interface IconStyle {
-    color?: string
-    fontSize?: string
-  }
-
-  const iconRender = (config: IconConfig) => {
-    const { color, fontSize, icon } = config
-
-    const style: IconStyle = {}
-
-    if (color)
-      style.color = color
-
-    if (fontSize)
-      style.fontSize = `${fontSize}px`
-
-    if (!icon)
-      window.console.warn('iconRender: icon is required')
-
-    return () => h(SvgIcon, { icon, style })
-  }
-
-  return {
-    iconRender,
-  }
-}

src/hooks/useLanguage.ts

@@ -1,24 +0,0 @@
-import { computed } from 'vue'
-import { enUS, zhCN } from 'naive-ui'
-import { useAppStore } from '@/store'
-import { setLocale } from '@/locales'
-
-export function useLanguage() {
-  const appStore = useAppStore()
-
-  const language = computed(() => {
-    switch (appStore.language) {
-      case 'en-US':
-        setLocale('en-US')
-        return enUS
-      case 'zh-CN':
-        setLocale('zh-CN')
-        return zhCN
-      default:
-        setLocale('zh-CN')
-        return enUS
-    }
-  })
-
-  return { language }
-}

src/hooks/useTheme.ts

@@ -1,43 +0,0 @@
-import type { GlobalThemeOverrides } from 'naive-ui'
-import { computed, watch } from 'vue'
-import { darkTheme, useOsTheme } from 'naive-ui'
-import { useAppStore } from '@/store'
-
-export function useTheme() {
-  const appStore = useAppStore()
-
-  const OsTheme = useOsTheme()
-
-  const isDark = computed(() => {
-    if (appStore.theme === 'auto')
-      return OsTheme.value === 'dark'
-    else
-      return appStore.theme === 'dark'
-  })
-
-  const theme = computed(() => {
-    return isDark.value ? darkTheme : undefined
-  })
-
-  const themeOverrides = computed<GlobalThemeOverrides>(() => {
-    if (isDark.value) {
-      return {
-        common: {},
-      }
-    }
-    return {}
-  })
-
-  watch(
-    () => isDark.value,
-    (dark) => {
-      if (dark)
-        document.documentElement.classList.add('dark')
-      else
-        document.documentElement.classList.remove('dark')
-    },
-    { immediate: true },
-  )
-
-  return { theme, themeOverrides }
-}

src/locales/en-US.ts

@@ -1,41 +0,0 @@
-export default {
-  common: {
-    delete: 'Delete',
-    save: 'Save',
-    reset: 'Reset',
-    yes: 'Yes',
-    no: 'No',
-    noData: 'No Data',
-    wrong: 'Something went wrong, please try again later.',
-    success: 'Success',
-    failed: 'Failed',
-  },
-  chat: {
-    placeholder: 'Ask me anything...(Shift + Enter = line break)',
-    placeholderMobile: 'Ask me anything...',
-    copy: 'Copy',
-    copied: 'Copied',
-    copyCode: 'Copy Code',
-    clearChat: 'Clear Chat',
-    clearChatConfirm: 'Are you sure to clear this chat?',
-    deleteMessage: 'Delete Message',
-    deleteMessageConfirm: 'Are you sure to delete this message?',
-    deleteHistoryConfirm: 'Are you sure to clear this history?',
-  },
-  setting: {
-    setting: 'Setting',
-    general: 'General',
-    config: 'Config',
-    avatarLink: 'Avatar Link',
-    name: 'Name',
-    description: 'Description',
-    resetUserInfo: 'Reset UserInfo',
-    theme: 'Theme',
-    language: 'Language',
-    api: 'API',
-    reverseProxy: 'Reverse Proxy',
-    timeout: 'Timeout',
-    socks: 'Socks',
-  },
-
-}

src/locales/index.ts

@@ -1,34 +0,0 @@
-import type { App } from 'vue'
-import { createI18n } from 'vue-i18n'
-import en from './en-US'
-import cn from './zh-CN'
-import { useAppStoreWithOut } from '@/store/modules/app'
-import type { Language } from '@/store/modules/app/helper'
-
-const appStore = useAppStoreWithOut()
-
-const defaultLocale = appStore.language || 'zh-CN'
-
-const i18n = createI18n({
-  locale: defaultLocale,
-  fallbackLocale: 'en-US',
-  allowComposition: true,
-  messages: {
-    'en-US': en,
-    'zh-CN': cn,
-  },
-})
-
-export function t(key: string) {
-  return i18n.global.t(key)
-}
-
-export function setLocale(locale: Language) {
-  i18n.global.locale = locale
-}
-
-export function setupI18n(app: App) {
-  app.use(i18n)
-}
-
-export default i18n

src/locales/zh-CN.ts

@@ -1,41 +0,0 @@
-export default {
-  common: {
-    delete: '删除',
-    save: '保存',
-    reset: '重置',
-    yes: '是',
-    no: '否',
-    noData: '暂无数据',
-    wrong: '好像出错了，请稍后再试。',
-    success: '操作成功',
-    failed: '操作失败',
-  },
-  chat: {
-    placeholder: '来说点什么...（Shift + Enter = 换行）',
-    placeholderMobile: '来说点什么...',
-    copy: '复制',
-    copied: '复制成功',
-    copyCode: '复制代码',
-    clearChat: '清空会话',
-    clearChatConfirm: '是否清空会话?',
-    deleteMessage: '删除消息',
-    deleteMessageConfirm: '是否删除此消息?',
-    deleteHistoryConfirm: '确定删除此记录?',
-  },
-  setting: {
-    setting: '设置',
-    general: '总览',
-    config: '配置',
-    avatarLink: '头像链接',
-    name: '名称',
-    description: '描述',
-    resetUserInfo: '重置用户信息',
-    theme: '主题',
-    language: '语言',
-    api: 'API',
-    reverseProxy: '反向代理',
-    timeout: '超时',
-    socks: 'Socks',
-  },
-
-}

src/main.ts

@@ -1,9 +1,9 @@
 import { createApp } from 'vue'
 import App from './App.vue'
-import { setupI18n } from './locales'
+import { setupDirectives } from './directives'
-import { setupAssets } from './plugins'
+import { setupAssets } from '@/plugins'
-import { setupStore } from './store'
+import { setupStore } from '@/store'
-import { setupRouter } from './router'
+import { setupRouter } from '@/router'
 
 async function bootstrap() {
   const app = createApp(App)
@@ -11,7 +11,7 @@ async function bootstrap() {
 
   setupStore(app)
 
-  setupI18n(app)
+  setupDirectives(app)
 
   await setupRouter(app)
 

src/plugins/assets.ts

@@ -1,8 +1,5 @@
-import 'katex/dist/katex.min.css'
+import 'highlight.js/styles/xcode.css'
-import '@/styles/lib/tailwind.css'
+import '@/styles/global.css'
-import '@/styles/lib/highlight.less'
-import '@/styles/lib/github-markdown.less'
-import '@/styles/global.less'
 
 /** Tailwind's Preflight Style Override */
 function naiveStyleOverride() {

src/router/index.ts

@@ -17,24 +17,6 @@ const routes: RouteRecordRaw[] = [
       },
     ],
   },
-
-  {
-    path: '/403',
-    name: '403',
-    component: () => import('@/views/exception/403/index.vue'),
-  },
-
-  {
-    path: '/404',
-    name: '404',
-    component: () => import('@/views/exception/404/index.vue'),
-  },
-
-  {
-    path: '/:pathMatch(.*)*',
-    name: 'notFound',
-    redirect: '/404',
-  },
 ]
 
 export const router = createRouter({

src/store/index.ts

@@ -1,9 +1,8 @@
 import type { App } from 'vue'
 import { createPinia } from 'pinia'
 
-export const store = createPinia()
-
 export function setupStore(app: App) {
+  const store = createPinia()
   app.use(store)
 }
 

src/store/modules/app/helper.ts

@@ -2,25 +2,19 @@ import { ss } from '@/utils/storage'
 
 const LOCAL_NAME = 'appSetting'
 
-export type Theme = 'light' | 'dark' | 'auto'
-
-export type Language = 'zh-CN' | 'en-US'
-
 export interface AppState {
   siderCollapsed: boolean
-  theme: Theme
-  language: Language
 }
 
-export function defaultSetting(): AppState {
+export function defaultSetting() {
-  return { siderCollapsed: false, theme: 'light', language: 'zh-CN' }
+  return { siderCollapsed: false }
 }
 
-export function getLocalSetting(): AppState {
+export function getLocalSetting() {
   const localSetting: AppState | undefined = ss.get(LOCAL_NAME)
-  return { ...defaultSetting(), ...localSetting }
+  return localSetting ?? defaultSetting()
 }
 
-export function setLocalSetting(setting: AppState): void {
+export function setLocalSetting(setting: AppState) {
   ss.set(LOCAL_NAME, setting)
 }

src/store/modules/app/index.ts

@@ -1,34 +1,13 @@
 import { defineStore } from 'pinia'
-import type { AppState, Language, Theme } from './helper'
+import type { AppState } from './helper'
 import { getLocalSetting, setLocalSetting } from './helper'
-import { store } from '@/store'
 
 export const useAppStore = defineStore('app-store', {
   state: (): AppState => getLocalSetting(),
   actions: {
     setSiderCollapsed(collapsed: boolean) {
       this.siderCollapsed = collapsed
-      this.recordState()
-    },
-
-    setTheme(theme: Theme) {
-      this.theme = theme
-      this.recordState()
-    },
-
-    setLanguage(language: Language) {
-      if (this.language !== language) {
-        this.language = language
-        this.recordState()
-      }
-    },
-
-    recordState() {
       setLocalSetting(this.$state)
     },
   },
 })
-
-export function useAppStoreWithOut() {
-  return useAppStore(store)
-}

src/store/modules/chat/helper.ts

@@ -3,7 +3,7 @@ import { ss } from '@/utils/storage'
 const LOCAL_NAME = 'chatStorage'
 
 export function defaultState(): Chat.ChatState {
-  const uuid = 1002
+  const uuid = Date.now()
   return { active: uuid, history: [{ uuid, title: 'New Chat', isEdit: false }], chat: [{ uuid, data: [] }] }
 }
 

src/store/modules/chat/index.ts

@@ -6,13 +6,6 @@ export const useChatStore = defineStore('chat-store', {
   state: (): Chat.ChatState => getLocalState(),
 
   getters: {
-    getChatHistoryByCurrentActive(state: Chat.ChatState) {
-      const index = state.history.findIndex(item => item.uuid === state.active)
-      if (index !== -1)
-        return state.history[index]
-      return null
-    },
-
     getChatByUuid(state: Chat.ChatState) {
       return (uuid?: number) => {
         if (uuid)
@@ -75,18 +68,6 @@ export const useChatStore = defineStore('chat-store', {
       return await this.reloadRoute(uuid)
     },
 
-    getChatByUuidAndIndex(uuid: number, index: number) {
-      if (!uuid || uuid === 0) {
-        if (this.chat.length)
-          return this.chat[0].data[index]
-        return null
-      }
-      const chatIndex = this.chat.findIndex(item => item.uuid === uuid)
-      if (chatIndex !== -1)
-        return this.chat[chatIndex].data[index]
-      return null
-    },
-
     addChatByUuid(uuid: number, chat: Chat.Chat) {
       if (!uuid || uuid === 0) {
         if (this.history.length === 0) {
@@ -129,22 +110,6 @@ export const useChatStore = defineStore('chat-store', {
       }
     },
 
-    updateChatSomeByUuid(uuid: number, index: number, chat: Partial<Chat.Chat>) {
-      if (!uuid || uuid === 0) {
-        if (this.chat.length) {
-          this.chat[0].data[index] = { ...this.chat[0].data[index], ...chat }
-          this.recordState()
-        }
-        return
-      }
-
-      const chatIndex = this.chat.findIndex(item => item.uuid === uuid)
-      if (chatIndex !== -1) {
-        this.chat[chatIndex].data[index] = { ...this.chat[chatIndex].data[index], ...chat }
-        this.recordState()
-      }
-    },
-
     deleteChatByUuid(uuid: number, index: number) {
       if (!uuid || uuid === 0) {
         if (this.chat.length) {

src/store/modules/index.ts

@@ -1,3 +1,2 @@
 export * from './app'
 export * from './chat'
-export * from './user'

src/store/modules/user/helper.ts

@@ -1,32 +0,0 @@
-import { ss } from '@/utils/storage'
-
-const LOCAL_NAME = 'userStorage'
-
-export interface UserInfo {
-  avatar: string
-  name: string
-  description: string
-}
-
-export interface UserState {
-  userInfo: UserInfo
-}
-
-export function defaultSetting(): UserState {
-  return {
-    userInfo: {
-      avatar: 'https://raw.githubusercontent.com/Chanzhaoyu/chatgpt-web/main/src/assets/avatar.jpg',
-      name: 'ChenZhaoYu',
-      description: 'Star on <a href="https://github.com/Chanzhaoyu/chatgpt-bot" class="text-blue-500" target="_blank" >Github</a>',
-    },
-  }
-}
-
-export function getLocalState(): UserState {
-  const localSetting: UserState | undefined = ss.get(LOCAL_NAME)
-  return { ...defaultSetting(), ...localSetting }
-}
-
-export function setLocalState(setting: UserState): void {
-  ss.set(LOCAL_NAME, setting)
-}

src/store/modules/user/index.ts

@@ -1,22 +0,0 @@
-import { defineStore } from 'pinia'
-import type { UserInfo, UserState } from './helper'
-import { defaultSetting, getLocalState, setLocalState } from './helper'
-
-export const useUserStore = defineStore('user-store', {
-  state: (): UserState => getLocalState(),
-  actions: {
-    updateUserInfo(userInfo: Partial<UserInfo>) {
-      this.userInfo = { ...this.userInfo, ...userInfo }
-      this.recordState()
-    },
-
-    resetUserInfo() {
-      this.userInfo = { ...defaultSetting().userInfo }
-      this.recordState()
-    },
-
-    recordState() {
-      setLocalState(this.$state)
-    },
-  },
-})

src/styles/global.css

@@ -1,3 +1,9 @@
 @tailwind base;
 @tailwind components;
 @tailwind utilities;
+
+html,
+body,
+#app {
+	height: 100%;
+}

src/styles/global.less

@@ -1,9 +0,0 @@
-html,
-body,
-#app {
-	height: 100%;
-}
-
-body {
-	padding-bottom: constant(safe-area-inset-bottom);
-}

src/styles/lib/highlight.less

@@ -1,203 +0,0 @@
-html.dark {
-	pre code.hljs {
-		display: block;
-		overflow-x: auto;
-		padding: 1em
-	}
-
-	code.hljs {
-		padding: 3px 5px
-	}
-
-	.hljs {
-		color: #abb2bf;
-		background: #282c34
-	}
-
-	.hljs-keyword,
-	.hljs-operator,
-	.hljs-pattern-match {
-		color: #f92672
-	}
-
-	.hljs-function,
-	.hljs-pattern-match .hljs-constructor {
-		color: #61aeee
-	}
-
-	.hljs-function .hljs-params {
-		color: #a6e22e
-	}
-
-	.hljs-function .hljs-params .hljs-typing {
-		color: #fd971f
-	}
-
-	.hljs-module-access .hljs-module {
-		color: #7e57c2
-	}
-
-	.hljs-constructor {
-		color: #e2b93d
-	}
-
-	.hljs-constructor .hljs-string {
-		color: #9ccc65
-	}
-
-	.hljs-comment,
-	.hljs-quote {
-		color: #b18eb1;
-		font-style: italic
-	}
-
-	.hljs-doctag,
-	.hljs-formula {
-		color: #c678dd
-	}
-
-	.hljs-deletion,
-	.hljs-name,
-	.hljs-section,
-	.hljs-selector-tag,
-	.hljs-subst {
-		color: #e06c75
-	}
-
-	.hljs-literal {
-		color: #56b6c2
-	}
-
-	.hljs-addition,
-	.hljs-attribute,
-	.hljs-meta .hljs-string,
-	.hljs-regexp,
-	.hljs-string {
-		color: #98c379
-	}
-
-	.hljs-built_in,
-	.hljs-class .hljs-title,
-	.hljs-title.class_ {
-		color: #e6c07b
-	}
-
-	.hljs-attr,
-	.hljs-number,
-	.hljs-selector-attr,
-	.hljs-selector-class,
-	.hljs-selector-pseudo,
-	.hljs-template-variable,
-	.hljs-type,
-	.hljs-variable {
-		color: #d19a66
-	}
-
-	.hljs-bullet,
-	.hljs-link,
-	.hljs-meta,
-	.hljs-selector-id,
-	.hljs-symbol,
-	.hljs-title {
-		color: #61aeee
-	}
-
-	.hljs-emphasis {
-		font-style: italic
-	}
-
-	.hljs-strong {
-		font-weight: 700
-	}
-
-	.hljs-link {
-		text-decoration: underline
-	}
-}
-
-html {
-	pre code.hljs {
-		display: block;
-		overflow-x: auto;
-		padding: 1em
-	}
-
-	code.hljs {
-		padding: 3px 5px
-	}
-
-	.hljs {
-		color: #383a42;
-		background: #fafafa
-	}
-
-	.hljs-comment,
-	.hljs-quote {
-		color: #a0a1a7;
-		font-style: italic
-	}
-
-	.hljs-doctag,
-	.hljs-formula,
-	.hljs-keyword {
-		color: #a626a4
-	}
-
-	.hljs-deletion,
-	.hljs-name,
-	.hljs-section,
-	.hljs-selector-tag,
-	.hljs-subst {
-		color: #e45649
-	}
-
-	.hljs-literal {
-		color: #0184bb
-	}
-
-	.hljs-addition,
-	.hljs-attribute,
-	.hljs-meta .hljs-string,
-	.hljs-regexp,
-	.hljs-string {
-		color: #50a14f
-	}
-
-	.hljs-attr,
-	.hljs-number,
-	.hljs-selector-attr,
-	.hljs-selector-class,
-	.hljs-selector-pseudo,
-	.hljs-template-variable,
-	.hljs-type,
-	.hljs-variable {
-		color: #986801
-	}
-
-	.hljs-bullet,
-	.hljs-link,
-	.hljs-meta,
-	.hljs-selector-id,
-	.hljs-symbol,
-	.hljs-title {
-		color: #4078f2
-	}
-
-	.hljs-built_in,
-	.hljs-class .hljs-title,
-	.hljs-title.class_ {
-		color: #c18401
-	}
-
-	.hljs-emphasis {
-		font-style: italic
-	}
-
-	.hljs-strong {
-		font-weight: 700
-	}
-
-	.hljs-link {
-		text-decoration: underline
-	}
-}

src/utils/format/index.ts

@@ -1,44 +0,0 @@
-/**
- * 转义 HTML 字符
- * @param source
- */
-export function encodeHTML(source: string) {
-  return source
-    .replace(/&/g, '&')
-    .replace(/</g, '&lt;')
-    .replace(/>/g, '&gt;')
-    .replace(/"/g, '&quot;')
-    .replace(/'/g, '&#39;')
-}
-
-/**
- * 判断是否为代码块
- * @param text
- */
-export function includeCode(text: string | null | undefined) {
-  const regexp = /^(?:\s{4}|\t).+/gm
-  return !!(text?.includes(' = ') || text?.match(regexp))
-}
-
-/**
- * 复制文本
- * @param options
- */
-export function copyText(options: { text: string; origin?: boolean }) {
-  const props = { origin: true, ...options }
-
-  let input: HTMLInputElement | HTMLTextAreaElement
-
-  if (props.origin)
-    input = document.createElement('textarea')
-  else
-    input = document.createElement('input')
-
-  input.setAttribute('readonly', 'readonly')
-  input.value = props.text
-  document.body.appendChild(input)
-  input.select()
-  if (document.execCommand('copy'))
-    document.execCommand('copy')
-  document.body.removeChild(input)
-}

src/utils/functions/includeCode.ts

@@ -0,0 +1,6 @@
+function includeCode(text: string | null | undefined) {
+  const regexp = /^(?:\s{4}|\t).+/gm
+  return !!(text?.includes(' = ') || text?.match(regexp))
+}
+
+export default includeCode

src/utils/request/axios.ts

@@ -2,6 +2,7 @@ import axios, { type AxiosResponse } from 'axios'
 
 const service = axios.create({
   baseURL: import.meta.env.VITE_GLOB_API_URL,
+  timeout: !isNaN(+import.meta.env.VITE_GLOB_API_TIMEOUT) ? Number(import.meta.env.VITE_GLOB_API_TIMEOUT) : 60 * 1000,
 })
 
 service.interceptors.request.use(

src/views/chat/components/Message/Avatar.vue

@@ -1,28 +1,16 @@
 <script lang="ts" setup>
-import { computed } from 'vue'
-import { NAvatar } from 'naive-ui'
-import { useUserStore } from '@/store'
-import { isString } from '@/utils/is'
-import defaultAvatar from '@/assets/avatar.jpg'
-
 interface Props {
   image?: boolean
 }
+
 defineProps<Props>()
-
-const userStore = useUserStore()
-
-const avatar = computed(() => userStore.userInfo.avatar)
 </script>
 
 <template>
-  <template v-if="image">
+  <img v-if="image" src="@/assets/avatar.jpg" class="object-cover w-full h-full " alt="avatar">
-    <NAvatar v-if="isString(avatar) && avatar.length > 0" :src="avatar" :fallback-src="defaultAvatar" />
+  <span v-else class="text-[27px]">
-    <NAvatar v-else round :src="defaultAvatar" />
-  </template>
-  <span v-else class="text-[28px] dark:text-white">
     <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 32 32" aria-hidden="true" width="1em" height="1em">
-      <path d="M29.71,13.09A8.09,8.09,0,0,0,20.34,2.68a8.08,8.08,0,0,0-13.7,2.9A8.08,8.08,0,0,0,2.3,18.9,8,8,0,0,0,3,25.45a8.08,8.08,0,0,0,8.69,3.87,8,8,0,0,0,6,2.68,8.09,8.09,0,0,0,7.7-5.61,8,8,0,0,0,5.33-3.86A8.09,8.09,0,0,0,29.71,13.09Zm-12,16.82a6,6,0,0,1-3.84-1.39l.19-.11,6.37-3.68a1,1,0,0,0,.53-.91v-9l2.69,1.56a.08.08,0,0,1,.05.07v7.44A6,6,0,0,1,17.68,29.91ZM4.8,24.41a6,6,0,0,1-.71-4l.19.11,6.37,3.68a1,1,0,0,0,1,0l7.79-4.49V22.8a.09.09,0,0,1,0,.08L13,26.6A6,6,0,0,1,4.8,24.41ZM3.12,10.53A6,6,0,0,1,6.28,7.9v7.57a1,1,0,0,0,.51.9l7.75,4.47L11.85,22.4a.14.14,0,0,1-.09,0L5.32,18.68a6,6,0,0,1-2.2-8.18Zm22.13,5.14-7.78-4.52L20.16,9.6a.08.08,0,0,1,.09,0l6.44,3.72a6,6,0,0,1-.9,10.81V16.56A1.06,1.06,0,0,0,25.25,15.67Zm2.68-4-.19-.12-6.36-3.7a1,1,0,0,0-1.05,0l-7.78,4.49V9.2a.09.09,0,0,1,0-.09L19,5.4a6,6,0,0,1,8.91,6.21ZM11.08,17.15,8.38,15.6a.14.14,0,0,1-.05-.08V8.1a6,6,0,0,1,9.84-4.61L18,3.6,11.61,7.28a1,1,0,0,0-.53.91ZM12.54,14,16,12l3.47,2v4L16,20l-3.47-2Z" fill="currentColor" />
+      <path d="M29.71,13.09A8.09,8.09,0,0,0,20.34,2.68a8.08,8.08,0,0,0-13.7,2.9A8.08,8.08,0,0,0,2.3,18.9,8,8,0,0,0,3,25.45a8.08,8.08,0,0,0,8.69,3.87,8,8,0,0,0,6,2.68,8.09,8.09,0,0,0,7.7-5.61,8,8,0,0,0,5.33-3.86A8.09,8.09,0,0,0,29.71,13.09Zm-12,16.82a6,6,0,0,1-3.84-1.39l.19-.11,6.37-3.68a1,1,0,0,0,.53-.91v-9l2.69,1.56a.08.08,0,0,1,.05.07v7.44A6,6,0,0,1,17.68,29.91ZM4.8,24.41a6,6,0,0,1-.71-4l.19.11,6.37,3.68a1,1,0,0,0,1,0l7.79-4.49V22.8a.09.09,0,0,1,0,.08L13,26.6A6,6,0,0,1,4.8,24.41ZM3.12,10.53A6,6,0,0,1,6.28,7.9v7.57a1,1,0,0,0,.51.9l7.75,4.47L11.85,22.4a.14.14,0,0,1-.09,0L5.32,18.68a6,6,0,0,1-2.2-8.18Zm22.13,5.14-7.78-4.52L20.16,9.6a.08.08,0,0,1,.09,0l6.44,3.72a6,6,0,0,1-.9,10.81V16.56A1.06,1.06,0,0,0,25.25,15.67Zm2.68-4-.19-.12-6.36-3.7a1,1,0,0,0-1.05,0l-7.78,4.49V9.2a.09.09,0,0,1,0-.09L19,5.4a6,6,0,0,1,8.91,6.21ZM11.08,17.15,8.38,15.6a.14.14,0,0,1-.05-.08V8.1a6,6,0,0,1,9.84-4.61L18,3.6,11.61,7.28a1,1,0,0,0-.53.91ZM12.54,14,16,12l3.47,2v4L16,20l-3.47-2Z" />
     </svg>
   </span>
 </template>

src/views/chat/components/Message/Text.vue

@@ -1,10 +1,7 @@
 <script lang="ts" setup>
-import { computed, ref } from 'vue'
+import { computed } from 'vue'
-import MarkdownIt from 'markdown-it'
+import { marked } from 'marked'
-import mdKatex from '@traptitech/markdown-it-katex'
+import includeCode from '@/utils/functions/includeCode'
-import hljs from 'highlight.js'
-import { useBasicLayout } from '@/hooks/useBasicLayout'
-import { t } from '@/locales'
 
 interface Props {
   inversion?: boolean
@@ -15,64 +12,52 @@ interface Props {
 
 const props = defineProps<Props>()
 
-const { isMobile } = useBasicLayout()
-
-const textRef = ref<HTMLElement>()
-
-const mdi = new MarkdownIt({
-  linkify: true,
-  highlight(code, language) {
-    const validLang = !!(language && hljs.getLanguage(language))
-    if (validLang) {
-      const lang = language ?? ''
-      return highlightBlock(hljs.highlight(lang, code, true).value, lang)
-    }
-    return highlightBlock(hljs.highlightAuto(code).value, '')
-  },
-})
-
-mdi.use(mdKatex, { blockClass: 'katexmath-block rounded-md p-[10px]', errorColor: ' #cc0000' })
-
 const wrapClass = computed(() => {
   return [
     'text-wrap',
+    'p-3',
     'min-w-[20px]',
     'rounded-md',
-    isMobile.value ? 'p-2' : 'p-3',
     props.inversion ? 'bg-[#d2f9d1]' : 'bg-[#f4f6f8]',
-    props.inversion ? 'dark:bg-[#a1dc95]' : 'dark:bg-[#1e1e20]',
     { 'text-red-500': props.error },
   ]
 })
 
 const text = computed(() => {
-  const value = props.text ?? ''
+  if (props.text) {
-  if (!props.inversion)
+    if (!includeCode(props.text))
-    return mdi.render(value)
+      return marked.parse(props.text)
-  return value
+    return props.text
+  }
+  return ''
 })
-
-function highlightBlock(str: string, lang?: string) {
-  return `<pre class="code-block-wrapper"><div class="code-block-header"><span class="code-block-header__lang">${lang}</span><span class="code-block-header__copy">${t('chat.copyCode')}</span></div><code class="hljs code-block-body ${lang}">${str}</code></pre>`
-}
-
-defineExpose({ textRef })
 </script>
 
 <template>
-  <div class="text-black" :class="wrapClass">
+  <div :class="wrapClass">
     <template v-if="loading">
-      <span class="dark:text-white w-[4px] h-[20px] block animate-blink" />
+      <span class="w-[5px] h-[20px] block animate-blink" />
     </template>
     <template v-else>
-      <div ref="textRef" class="leading-relaxed break-words">
+      <code v-if="includeCode(text)" v-highlight class="leading-relaxed" v-text="text" />
-        <div v-if="!inversion" class="markdown-body" v-html="text" />
+      <div v-else class="leading-relaxed break-all" v-html="text" />
-        <div v-else class="whitespace-pre-wrap" v-text="text" />
-      </div>
     </template>
   </div>
 </template>
 
 <style lang="less">
-@import url(./style.less);
+.text-wrap{
+  img{
+    max-width: 100%;
+    vertical-align: middle;
+  }
+  a {
+    color: #2d5cf6
+  }
+}
+
+.hljs {
+  background-color: #fff0 !important;
+  white-space: break-spaces;
+}
 </style>

src/views/chat/components/Message/index.vue

@@ -1,12 +1,7 @@
 <script setup lang='ts'>
-import { ref } from 'vue'
+import Avatar from './Avatar.vue'
-import { NDropdown } from 'naive-ui'
+import Text from './Text.vue'
-import AvatarComponent from './Avatar.vue'
-import TextComponent from './Text.vue'
 import { SvgIcon } from '@/components/common'
-import { copyText } from '@/utils/format'
-import { useIconRender } from '@/hooks/useIconRender'
-import { t } from '@/locales'
 
 interface Props {
   dateTime?: string
@@ -18,38 +13,16 @@ interface Props {
 
 interface Emit {
   (ev: 'regenerate'): void
+  (ev: 'copy'): void
   (ev: 'delete'): void
 }
 
-const props = defineProps<Props>()
+defineProps<Props>()
 
 const emit = defineEmits<Emit>()
 
-const { iconRender } = useIconRender()
+function handleDelete() {
-
+  emit('delete')
-const textRef = ref<HTMLElement>()
-
-const options = [
-  {
-    label: t('chat.copy'),
-    key: 'copyText',
-    icon: iconRender({ icon: 'ri:file-copy-2-line' }),
-  },
-  {
-    label: t('common.delete'),
-    key: 'delete',
-    icon: iconRender({ icon: 'ri:delete-bin-line' }),
-  },
-]
-
-function handleSelect(key: 'copyRaw' | 'copyText' | 'delete') {
-  switch (key) {
-    case 'copyText':
-      copyText({ text: props.text ?? '' })
-      return
-    case 'delete':
-      emit('delete')
-  }
 }
 
 function handleRegenerate() {
@@ -58,23 +31,19 @@ function handleRegenerate() {
 </script>
 
 <template>
-  <div class="flex w-full mb-6 overflow-hidden" :class="[{ 'flex-row-reverse': inversion }]">
+  <div class="flex w-full mb-6" :class="[{ 'flex-row-reverse': inversion }]">
     <div
-      class="flex items-center justify-center flex-shrink-0 h-8 overflow-hidden rounded-full basis-8"
+      class="flex items-center justify-center rounded-full overflow-hidden w-[32px] h-[32px]"
-      :class="[inversion ? 'ml-2' : 'mr-2']"
+      :class="[inversion ? 'ml-3' : 'mr-3']"
     >
-      <AvatarComponent :image="inversion" />
+      <Avatar :image="inversion" />
     </div>
-    <div class="overflow-hidden text-sm " :class="[inversion ? 'items-end' : 'items-start']">
+    <div class="flex flex-col flex-1 text-sm" :class="[inversion ? 'items-end' : 'items-start']">
-      <p class="text-xs text-[#b4bbc4]" :class="[inversion ? 'text-right' : 'text-left']">
+      <span class="text-xs text-[#b4bbc4]">
         {{ dateTime }}
-      </p>
+      </span>
-      <div
+      <div class="flex items-end gap-2 mt-2" :class="[inversion ? 'flex-row-reverse' : 'flex-row']">
-        class="flex items-end gap-1 mt-2"
+        <Text
-        :class="[inversion ? 'flex-row-reverse' : 'flex-row']"
-      >
-        <TextComponent
-          ref="textRef"
           :inversion="inversion"
           :error="error"
           :text="text"
@@ -83,16 +52,17 @@ function handleRegenerate() {
         <div class="flex flex-col">
           <button
             v-if="!inversion"
-            class="mb-2 transition text-neutral-300 hover:text-neutral-800 dark:hover:text-neutral-300"
+            class="mb-2 transition text-neutral-400 hover:text-neutral-800"
             @click="handleRegenerate"
           >
             <SvgIcon icon="ri:restart-line" />
           </button>
-          <NDropdown :placement="!inversion ? 'right' : 'left'" :options="options" @select="handleSelect">
+          <button
-            <button class="transition text-neutral-300 hover:text-neutral-800 dark:hover:text-neutral-200">
+            class="mb-1 transition text-neutral-400 hover:text-neutral-800"
-              <SvgIcon icon="ri:more-2-fill" />
+            @click="handleDelete"
-            </button>
+          >
-          </NDropdown>
+            <SvgIcon icon="ri:delete-bin-6-line" />
+          </button>
         </div>
       </div>
     </div>

src/views/chat/components/Message/style.less

@@ -1,66 +0,0 @@
-.markdown-body {
-	background-color: transparent;
-	font-size: 14px;
-
-	p {
-		white-space: pre-wrap;
-	}
-
-	ol {
-		list-style-type: decimal;
-	}
-
-	ul {
-		list-style-type: disc;
-	}
-
-	pre code,
-	pre tt {
-		line-height: 1.65;
-	}
-
-	.highlight pre,
-	pre {
-		background-color: #fff;
-	}
-
-	code.hljs {
-		padding: 0;
-	}
-
-	.code-block {
-		&-wrapper {
-			position: relative;
-			padding-top: 24px;
-		}
-
-		&-header {
-			position: absolute;
-			top: 5px;
-			right: 0;
-			width: 100%;
-			padding: 0 1rem;
-			display: flex;
-			justify-content: flex-end;
-			align-items: center;
-			color: #b3b3b3;
-
-			&__copy{
-				cursor: pointer;
-				margin-left: 0.5rem;
-				user-select: none;
-				&:hover {
-					color: #65a665;
-				}
-			}
-		}
-	}
-}
-
-html.dark {
-
-	.highlight pre,
-	pre {
-		background-color: #282c34;
-	}
-}

src/views/chat/hooks/useChat.ts

@@ -3,10 +3,6 @@ import { useChatStore } from '@/store'
 export function useChat() {
   const chatStore = useChatStore()
 
-  const getChatByUuidAndIndex = (uuid: number, index: number) => {
-    return chatStore.getChatByUuidAndIndex(uuid, index)
-  }
-
   const addChat = (uuid: number, chat: Chat.Chat) => {
     chatStore.addChatByUuid(uuid, chat)
   }
@@ -15,14 +11,8 @@ export function useChat() {
     chatStore.updateChatByUuid(uuid, index, chat)
   }
 
-  const updateChatSome = (uuid: number, index: number, chat: Partial<Chat.Chat>) => {
-    chatStore.updateChatSomeByUuid(uuid, index, chat)
-  }
-
   return {
     addChat,
     updateChat,
-    updateChatSome,
-    getChatByUuidAndIndex,
   }
 }

src/views/chat/hooks/useCopyCode.ts

@@ -1,24 +0,0 @@
-import { onMounted, onUpdated } from 'vue'
-import { copyText } from '@/utils/format'
-
-export function useCopyCode() {
-  function copyCodeBlock() {
-    const codeBlockWrapper = document.querySelectorAll('.code-block-wrapper')
-    codeBlockWrapper.forEach((wrapper) => {
-      const copyBtn = wrapper.querySelector('.code-block-header__copy')
-      const codeBlock = wrapper.querySelector('.code-block-body')
-      if (copyBtn && codeBlock) {
-        copyBtn.addEventListener('click', () => {
-          if (navigator.clipboard?.writeText)
-            navigator.clipboard.writeText(codeBlock.textContent ?? '')
-          else
-            copyText({ text: codeBlock.textContent ?? '', origin: true })
-        })
-      }
-    })
-  }
-
-  onMounted(() => copyCodeBlock())
-
-  onUpdated(() => copyCodeBlock())
-}

src/views/chat/index.vue

@@ -1,27 +1,25 @@
 <script setup lang='ts'>
 import { computed, onMounted, onUnmounted, ref } from 'vue'
 import { useRoute } from 'vue-router'
-import { NButton, NInput, useDialog } from 'naive-ui'
+import { NButton, NInput, useDialog, useMessage } from 'naive-ui'
 import { Message } from './components'
 import { useScroll } from './hooks/useScroll'
 import { useChat } from './hooks/useChat'
-import { useCopyCode } from './hooks/useCopyCode'
 import { HoverButton, SvgIcon } from '@/components/common'
 import { useBasicLayout } from '@/hooks/useBasicLayout'
 import { useChatStore } from '@/store'
-import { fetchChatAPIProcess } from '@/api'
+import { fetchChatAPI } from '@/api'
-import { t } from '@/locales'
 
 let controller = new AbortController()
 
 const route = useRoute()
 const dialog = useDialog()
+const ms = useMessage()
 
 const chatStore = useChatStore()
 
-useCopyCode()
 const { isMobile } = useBasicLayout()
-const { addChat, updateChat, updateChatSome, getChatByUuidAndIndex } = useChat()
+const { addChat, updateChat } = useChat()
 const { scrollRef, scrollToBottom } = useScroll()
 
 const { uuid } = route.params as { uuid: string }
@@ -73,7 +71,7 @@ async function onConversation() {
     +uuid,
     {
       dateTime: new Date().toLocaleString(),
-      text: '',
+      text: 'Aha, Thinking...',
       loading: true,
       inversion: false,
       error: false,
@@ -84,70 +82,27 @@ async function onConversation() {
   scrollToBottom()
 
   try {
-    await fetchChatAPIProcess<Chat.ConversationResponse>({
+    const { data } = await fetchChatAPI<Chat.ConversationResponse>(message, options, controller.signal)
-      prompt: message,
+    updateChat(
-      options,
+      +uuid,
-      signal: controller.signal,
+      dataSources.value.length - 1,
-      onDownloadProgress: ({ event }) => {
+      {
-        const xhr = event.target
+        dateTime: new Date().toLocaleString(),
-        const { responseText } = xhr
+        text: data.text ?? '',
-        // Always process the final line
+        inversion: false,
-        const lastIndex = responseText.lastIndexOf('\n')
+        error: false,
-        let chunk = responseText
+        loading: false,
-        if (lastIndex !== -1)
+        conversationOptions: { conversationId: data.conversationId, parentMessageId: data.id },
-          chunk = responseText.substring(lastIndex)
+        requestOptions: { prompt: message, options: { ...options } },
-        try {
-          const data = JSON.parse(chunk)
-          updateChat(
-            +uuid,
-            dataSources.value.length - 1,
-            {
-              dateTime: new Date().toLocaleString(),
-              text: data.text ?? '',
-              inversion: false,
-              error: false,
-              loading: false,
-              conversationOptions: { conversationId: data.conversationId, parentMessageId: data.id },
-              requestOptions: { prompt: message, options: { ...options } },
-            },
-          )
-          scrollToBottom()
-        }
-        catch (error) {
-          //
-        }
       },
-    })
+    )
+    scrollToBottom()
   }
   catch (error: any) {
-    const errorMessage = error?.message ?? t('common.wrong')
+    let errorMessage = error?.message ?? 'Something went wrong, please try again later.'
 
-    if (error.message === 'canceled') {
+    if (error.message === 'canceled')
-      updateChatSome(
+      errorMessage = 'Request canceled. Please try again.'
-        +uuid,
-        dataSources.value.length - 1,
-        {
-          loading: false,
-        },
-      )
-      scrollToBottom()
-      return
-    }
-
-    const currentChat = getChatByUuidAndIndex(+uuid, dataSources.value.length - 1)
-
-    if (currentChat?.text && currentChat.text !== '') {
-      updateChatSome(
-        +uuid,
-        dataSources.value.length - 1,
-        {
-          text: `${currentChat.text}\n[${errorMessage}]`,
-          error: false,
-          loading: false,
-        },
-      )
-      return
-    }
 
     updateChat(
       +uuid,
@@ -191,7 +146,7 @@ async function onRegenerate(index: number) {
     index,
     {
       dateTime: new Date().toLocaleString(),
-      text: '',
+      text: 'Aha, Let me think again...',
       inversion: false,
       error: false,
       loading: true,
@@ -201,53 +156,26 @@ async function onRegenerate(index: number) {
   )
 
   try {
-    await fetchChatAPIProcess<Chat.ConversationResponse>({
+    const { data } = await fetchChatAPI<Chat.ConversationResponse>(message, options, controller.signal)
-      prompt: message,
+    updateChat(
-      options,
+      +uuid,
-      signal: controller.signal,
+      index,
-      onDownloadProgress: ({ event }) => {
+      {
-        const xhr = event.target
+        dateTime: new Date().toLocaleString(),
-        const { responseText } = xhr
+        text: data.text ?? '',
-        // Always process the final line
+        inversion: false,
-        const lastIndex = responseText.lastIndexOf('\n')
+        error: false,
-        let chunk = responseText
+        loading: false,
-        if (lastIndex !== -1)
+        conversationOptions: { conversationId: data.conversationId, parentMessageId: data.id },
-          chunk = responseText.substring(lastIndex)
+        requestOptions: { prompt: message, ...options },
-        try {
-          const data = JSON.parse(chunk)
-          updateChat(
-            +uuid,
-            index,
-            {
-              dateTime: new Date().toLocaleString(),
-              text: data.text ?? '',
-              inversion: false,
-              error: false,
-              loading: false,
-              conversationOptions: { conversationId: data.conversationId, parentMessageId: data.id },
-              requestOptions: { prompt: message, ...options },
-            },
-          )
-        }
-        catch (error) {
-          //
-        }
       },
-    })
+    )
   }
   catch (error: any) {
-    if (error.message === 'canceled') {
+    let errorMessage = 'Something went wrong, please try again later.'
-      updateChatSome(
-        +uuid,
-        index,
-        {
-          loading: false,
-        },
-      )
-      return
-    }
 
-    const errorMessage = error?.message ?? t('common.wrong')
+    if (error.message === 'canceled')
+      errorMessage = 'Request canceled. Please try again.'
 
     updateChat(
       +uuid,
@@ -273,12 +201,13 @@ function handleDelete(index: number) {
     return
 
   dialog.warning({
-    title: t('chat.deleteMessage'),
+    title: 'Delete Message',
-    content: t('chat.deleteMessageConfirm'),
+    content: 'Are you sure to delete this message?',
-    positiveText: t('common.yes'),
+    positiveText: 'Yes',
-    negativeText: t('common.no'),
+    negativeText: 'No',
     onPositiveClick: () => {
       chatStore.deleteChatByUuid(+uuid, index)
+      ms.success('Message deleted successfully.')
     },
   })
 }
@@ -288,10 +217,10 @@ function handleClear() {
     return
 
   dialog.warning({
-    title: t('chat.clearChat'),
+    title: 'Clear Chat',
-    content: t('chat.clearChatConfirm'),
+    content: 'Are you sure to clear this chat?',
-    positiveText: t('common.yes'),
+    positiveText: 'Yes',
-    negativeText: t('common.no'),
+    negativeText: 'No',
     onPositiveClick: () => {
       chatStore.clearChatByUuid(+uuid)
     },
@@ -299,11 +228,9 @@ function handleClear() {
 }
 
 function handleEnter(event: KeyboardEvent) {
-  if (!isMobile.value) {
+  if (event.key === 'Enter' && !event.shiftKey) {
-    if (event.key === 'Enter' && !event.shiftKey) {
+    event.preventDefault()
-      event.preventDefault()
+    handleSubmit()
-      handleSubmit()
-    }
   }
 }
 
@@ -314,26 +241,21 @@ function handleStop() {
   }
 }
 
-const placeholder = computed(() => {
-  if (isMobile.value)
-    return t('chat.placeholderMobile')
-  return t('chat.placeholder')
-})
-
 const buttonDisabled = computed(() => {
   return loading.value || !prompt.value || prompt.value.trim() === ''
 })
 
 const wrapClass = computed(() => {
   if (isMobile.value)
-    return ['pt-14']
+    return ['pt-14', 'pb-14']
+
   return []
 })
 
 const footerClass = computed(() => {
   let classes = ['p-4']
   if (isMobile.value)
-    classes = ['sticky', 'left-0', 'bottom-0', 'right-0', 'p-2', 'pr-4', 'overflow-hidden']
+    classes = ['p-2', 'pr-4', 'fixed', 'bottom-4', 'left-0', 'right-0', 'z-30', 'h-14', 'overflow-hidden']
   return classes
 })
 
@@ -348,70 +270,59 @@ onUnmounted(() => {
 </script>
 
 <template>
-  <div class="flex flex-col w-full h-full" :class="wrapClass">
+  <div class="flex flex-col h-full" :class="wrapClass">
     <main class="flex-1 overflow-hidden">
-      <div
+      <div ref="scrollRef" class="h-full p-4 overflow-hidden overflow-y-auto" :class="[{ 'p-2': isMobile }]">
-        id="scrollRef"
+        <template v-if="!dataSources.length">
-        ref="scrollRef"
+          <div class="flex items-center justify-center mt-4 text-center text-neutral-300">
-        class="h-full overflow-hidden overflow-y-auto"
+            <SvgIcon icon="ri:bubble-chart-fill" class="mr-2 text-3xl" />
-        :class="[isMobile ? 'p-2' : 'p-4']"
+            <span>Aha~</span>
-      >
+          </div>
-        <div class="w-full max-w-screen-xl m-auto">
+        </template>
-          <template v-if="!dataSources.length">
+        <template v-else>
-            <div class="flex items-center justify-center mt-4 text-center text-neutral-300">
+          <div>
-              <SvgIcon icon="ri:bubble-chart-fill" class="mr-2 text-3xl" />
+            <Message
-              <span>Aha~</span>
+              v-for="(item, index) of dataSources"
+              :key="index"
+              :date-time="item.dateTime"
+              :text="item.text"
+              :inversion="item.inversion"
+              :error="item.error"
+              :loading="item.loading"
+              @regenerate="onRegenerate(index)"
+              @delete="handleDelete(index)"
+            />
+            <div class="flex justify-center">
+              <NButton v-if="loading" ghost @click="handleStop">
+                <template #icon>
+                  <SvgIcon icon="ri:stop-circle-line" />
+                </template>
+                Stop Responding
+              </NButton>
             </div>
-          </template>
+          </div>
-          <template v-else>
+        </template>
-            <div>
-              <Message
-                v-for="(item, index) of dataSources"
-                :key="index"
-                :date-time="item.dateTime"
-                :text="item.text"
-                :inversion="item.inversion"
-                :error="item.error"
-                :loading="item.loading"
-                @regenerate="onRegenerate(index)"
-                @delete="handleDelete(index)"
-              />
-              <div class="sticky bottom-0 left-0 flex justify-center">
-                <NButton v-if="loading" type="warning" @click="handleStop">
-                  <template #icon>
-                    <SvgIcon icon="ri:stop-circle-line" />
-                  </template>
-                  Stop Responding
-                </NButton>
-              </div>
-            </div>
-          </template>
-        </div>
       </div>
     </main>
     <footer :class="footerClass">
-      <div class="w-full max-w-screen-xl m-auto">
+      <div class="flex items-center justify-between space-x-2">
-        <div class="flex items-center justify-between space-x-2">
+        <HoverButton @click="handleClear">
-          <HoverButton @click="handleClear">
+          <span class="text-xl text-[#4f555e]">
-            <span class="text-xl text-[#4f555e] dark:text-white">
+            <SvgIcon icon="ri:delete-bin-line" />
-              <SvgIcon icon="ri:delete-bin-line" />
+          </span>
-            </span>
+        </HoverButton>
-          </HoverButton>
+        <NInput
-          <NInput
+          v-model:value="prompt"
-            v-model:value="prompt"
+          type="textarea"
-            type="textarea"
+          :autosize="{ minRows: 1, maxRows: 2 }"
-            :autosize="{ minRows: 1, maxRows: 2 }"
+          placeholder="Ask me anything..."
-            :placeholder="placeholder"
+          @keypress="handleEnter"
-            @keypress="handleEnter"
+        />
-          />
+        <NButton type="primary" :disabled="buttonDisabled" @click="handleSubmit">
-          <NButton type="primary" :disabled="buttonDisabled" @click="handleSubmit">
+          <template #icon>
-            <template #icon>
+            <SvgIcon icon="ri:send-plane-fill" />
-              <span class="dark:text-black">
+          </template>
-                <SvgIcon icon="ri:send-plane-fill" />
+        </NButton>
-              </span>
-            </template>
-          </NButton>
-        </div>
       </div>
     </footer>
   </div>

src/views/chat/layout/Layout.vue

@@ -20,7 +20,7 @@ const collapsed = computed(() => appStore.siderCollapsed)
 const getMobileClass = computed(() => {
   if (isMobile.value)
     return ['rounded-none', 'shadow-none']
-  return ['border', 'rounded-md', 'shadow-md', 'dark:border-neutral-800']
+  return ['border', 'rounded-md', 'shadow-md']
 })
 
 const getContainerClass = computed(() => {
@@ -32,7 +32,7 @@ const getContainerClass = computed(() => {
 </script>
 
 <template>
-  <div class="h-full dark:bg-[#24272e] transition-all" :class="[isMobile ? 'p-0' : 'p-4']">
+  <div class="h-full" :class="[isMobile ? 'p-0' : 'p-4']">
     <div class="h-full overflow-hidden" :class="getMobileClass">
       <NLayout class="z-40 transition" :class="getContainerClass" has-sider>
         <Sider />

src/views/chat/layout/header/index.vue

@@ -1,5 +1,5 @@
 <script lang="ts" setup>
-import { computed, nextTick } from 'vue'
+import { computed } from 'vue'
 import { SvgIcon } from '@/components/common'
 import { useAppStore, useChatStore } from '@/store'
 
@@ -7,48 +7,25 @@ const appStore = useAppStore()
 const chatStore = useChatStore()
 
 const collapsed = computed(() => appStore.siderCollapsed)
-const currentChatHistory = computed(() => chatStore.getChatHistoryByCurrentActive)
+
+function handleAdd() {
+  chatStore.addHistory({ title: 'New Chat', uuid: Date.now(), isEdit: false })
+}
 
 function handleUpdateCollapsed() {
   appStore.setSiderCollapsed(!collapsed.value)
 }
-
-function onScrollToTop() {
-  const scrollRef = document.querySelector('#scrollRef')
-  if (scrollRef)
-    nextTick(() => scrollRef.scrollTop = 0)
-}
-
-function onScrollToBottom() {
-  const scrollRef = document.querySelector('#scrollRef')
-  if (scrollRef)
-    nextTick(() => scrollRef.scrollTop = scrollRef.scrollHeight)
-}
 </script>
 
 <template>
-  <header
+  <header class="fixed top-0 left-0 right-0 z-30 border-b bg-white/80 backdrop-blur">
-    class="fixed top-0 left-0 right-0 z-30 border-b dark:border-neutral-800 bg-white/80 dark:bg-black/20 backdrop-blur"
-  >
     <div class="relative flex items-center justify-between h-14">
-      <button
+      <button class="flex items-center justify-center w-11 h-11" @click="handleUpdateCollapsed">
-        class="flex items-center justify-center w-11 h-11"
-        @click="handleUpdateCollapsed"
-      >
         <SvgIcon v-if="collapsed" class="text-2xl" icon="ri:align-justify" />
         <SvgIcon v-else class="text-2xl" icon="ri:align-right" />
       </button>
-      <h1
+      <button class="flex items-center justify-center w-11 h-11" @click="handleAdd">
-        class="flex-1 px-4 overflow-hidden text-center cursor-pointer select-none text-ellipsis whitespace-nowrap"
+        <SvgIcon class="text-2xl" icon="ri:add-fill" />
-        @dblclick="onScrollToTop"
-      >
-        {{ currentChatHistory?.title ?? '' }}
-      </h1>
-      <button
-        class="flex items-center justify-center w-11 h-11"
-        @click="onScrollToBottom"
-      >
-        <SvgIcon class="text-2xl" icon="ri:arrow-down-s-line" />
       </button>
     </div>
   </header>

src/views/chat/layout/sider/Footer.vue

@@ -1,22 +1,19 @@
 <script setup lang='ts'>
-import { defineAsyncComponent, ref } from 'vue'
+import { ref } from 'vue'
-import { HoverButton, SvgIcon, UserAvatar } from '@/components/common'
+import { HoverButton, Setting, SvgIcon, UserAvatar } from '@/components/common'
-
-const Setting = defineAsyncComponent(() => import('@/components/common/Setting/index.vue'))
 
 const show = ref(false)
 </script>
 
 <template>
-  <footer class="flex items-center justify-between min-w-0 p-4 overflow-hidden border-t dark:border-neutral-800">
+  <footer class="flex items-center justify-between min-w-0 p-4 overflow-hidden border-t">
     <UserAvatar />
-
+    <HoverButton tooltip="Setting" @click="show = true">
-    <HoverButton :tooltip="$t('setting.setting')" @click="show = true">
+      <span class="text-xl text-[#4f555e]">
-      <span class="text-xl text-[#4f555e] dark:text-white">
         <SvgIcon icon="ri:settings-4-line" />
       </span>
     </HoverButton>
 
-    <Setting v-if="show" v-model:visible="show" />
+    <Setting v-model:visible="show" />
   </footer>
 </template>

src/views/chat/layout/sider/List.vue

@@ -16,8 +16,6 @@ async function handleSelect({ uuid }: Chat.History) {
   if (isActive(uuid))
     return
 
-  if (chatStore.active)
-    chatStore.updateHistory(chatStore.active, { isEdit: false })
   await chatStore.setActive(uuid)
 
   if (isMobile.value)
@@ -51,14 +49,14 @@ function isActive(uuid: number) {
       <template v-if="!dataSources.length">
         <div class="flex flex-col items-center mt-4 text-center text-neutral-300">
           <SvgIcon icon="ri:inbox-line" class="mb-2 text-3xl" />
-          <span>{{ $t('common.noData') }}</span>
+          <span>No history</span>
         </div>
       </template>
       <template v-else>
         <div v-for="(item, index) of dataSources" :key="index">
           <a
-            class="relative flex items-center gap-3 px-3 py-3 break-all border rounded-md cursor-pointer hover:bg-neutral-100 group dark:border-neutral-800 dark:hover:bg-[#24272e]"
+            class="relative flex items-center gap-3 px-3 py-3 break-all border rounded-md cursor-pointer hover:bg-neutral-100 group"
-            :class="isActive(item.uuid) && ['border-[#4b9e5f]', 'bg-neutral-100', 'text-[#4b9e5f]', 'dark:bg-[#24272e]', 'dark:border-[#4b9e5f]', 'pr-14']"
+            :class="isActive(item.uuid) && ['border-[#4b9e5f]', 'bg-neutral-100', 'text-[#4b9e5f]', 'pr-14']"
             @click="handleSelect(item)"
           >
             <span>
@@ -89,7 +87,7 @@ function isActive(uuid: number) {
                       <SvgIcon icon="ri:delete-bin-line" />
                     </button>
                   </template>
-                  {{ $t('chat.deleteHistoryConfirm') }}
+                  Are you sure to clear this history?
                 </NPopconfirm>
               </template>
             </div>

src/views/chat/layout/sider/index.vue

@@ -32,15 +32,6 @@ const getMobileClass = computed<CSSProperties>(() => {
   return {}
 })
 
-const mobileSafeArea = computed(() => {
-  if (isMobile.value) {
-    return {
-      paddingBottom: 'env(safe-area-inset-bottom)',
-    }
-  }
-  return {}
-})
-
 watch(
   isMobile,
   (val) => {
@@ -65,7 +56,7 @@ watch(
     :style="getMobileClass"
     @update-collapsed="handleUpdateCollapsed"
   >
-    <div class="flex flex-col h-full" :style="mobileSafeArea">
+    <div class="flex flex-col h-full">
       <main class="flex flex-col flex-1 min-h-0">
         <div class="p-4">
           <NButton dashed block @click="handleAdd">

src/views/exception/403/index.vue

@@ -1,34 +0,0 @@
-<script lang="ts" setup>
-import { NButton } from 'naive-ui'
-import { useRouter } from 'vue-router'
-
-const router = useRouter()
-
-function goHome() {
-  router.push('/')
-}
-</script>
-
-<template>
-  <div class="flex h-full">
-    <div class="px-4 m-auto space-y-4 text-center max-[400px]">
-      <h1 class="text-4xl text-slate-800 dark:text-neutral-200">
-        No permission
-      </h1>
-      <p class="text-base text-slate-500 dark:text-neutral-400">
-        The page you're trying access has restricted access.
-        Please refer to your system administrator
-      </p>
-      <div class="flex items-center justify-center text-center">
-        <div class="w-[300px]">
-          <div class="w-[300px]">
-            <img src="../../../icons/403.svg" alt="404">
-          </div>
-        </div>
-      </div>
-      <NButton type="primary" @click="goHome">
-        Go to Home
-      </NButton>
-    </div>
-  </div>
-</template>

src/views/exception/404/index.vue

@@ -1,31 +0,0 @@
-<script lang="ts" setup>
-import { NButton } from 'naive-ui'
-import { useRouter } from 'vue-router'
-
-const router = useRouter()
-
-function goHome() {
-  router.push('/')
-}
-</script>
-
-<template>
-  <div class="flex h-full">
-    <div class="px-4 m-auto space-y-4 text-center max-[400px]">
-      <h1 class="text-4xl text-slate-800 dark:text-neutral-200">
-        Sorry, page not found!
-      </h1>
-      <p class="text-base text-slate-500 dark:text-neutral-400">
-        Sorry, we couldn’t find the page you’re looking for. Perhaps you’ve mistyped the URL? Be sure to check your spelling.
-      </p>
-      <div class="flex items-center justify-center text-center">
-        <div class="w-[300px]">
-          <img src="../../../icons/404.svg" alt="404">
-        </div>
-      </div>
-      <NButton type="primary" @click="goHome">
-        Go to Home
-      </NButton>
-    </div>
-  </div>
-</template>

tailwind.config.js

@@ -1,6 +1,5 @@
 /** @type {import('tailwindcss').Config} */
 module.exports = {
-  darkMode: 'class',
   content: [
     './index.html',
     './src/**/*.{vue,js,ts,jsx,tsx}',
@@ -12,7 +11,7 @@ module.exports = {
       },
       keyframes: {
         blink: {
-          '0%, 100%': { 'background-color': 'currentColor' },
+          '0%, 100%': { 'background-color': '#000' },
           '50%': { 'background-color': 'transparent' },
         },
       },

tsconfig.json

@@ -13,11 +13,11 @@
     "noUnusedLocals": true,
     "strictNullChecks": true,
     "forceConsistentCasingInFileNames": true,
-    "skipLibCheck": true,
     "paths": {
       "@/*": ["./src/*"]
     },
-    "types": ["vite/client", "node", "naive-ui/volar"]
+    // @vueuse/core 不能通过 vue-tsc 检查，所以这里需要忽略，以后将移除
+    "types": ["vite/client", "node", "naive-ui/volar", "web-bluetooth"]
   },
   "exclude": ["node_modules", "dist", "service"]
 }