2025跨平台ai实战-electron35+vite6对接deepseek-v3聊天模型搭建客户端ai聊天助手。

免费影视、动漫、音乐、游戏、小说资源长期稳定更新！ 👉 点此立即查看 👈

Electron-DeepChat支持流式stream输出、暗黑+亮色主题、代码高亮等功能。

使用技术技术框架：vite^6.2.0+vue^3.5.13+vue-router^4.5.0大模型ai框架：DeepSeek-V3-0324 + OpenAI跨平台框架：electron^35.1.2组件库：arco-design^2.57.0 (字节桌面端组件库)状态插件：pinia^3.0.1会话缓存：pinia-plugin-persistedstate^4.2.0高亮插件：highlight.js^11.11.1markdown解析：markdown-it

功能特点基于跨平台Electron35框架，接入DeepSeek-V3，性能更丝滑支持各种代码高亮效果、易于展示分享代码片段支持上下文多轮对话、提示词生成图片及预览功能支持多窗口、亮色+暗黑主题支持新窗口打开会话里面的链接采用arco-design组件库，风格一致性

项目结构目录

基于最新跨平台框架Electron35和Vite6构建工具搭建项目模板，整合最新DeepSeek-V3聊天大模型。

环境变量.env配置

需先申请一个deepseek apikey，替换掉.env文件里的key即可快速体验聊天ai功能。

代码语言：actionscript复制

# 项目名称VITE_APPNAME = 'Electron35-DeepSeek'# 运行端口VITE_PORT = 3003# 是否加载调试工具devtoolsVITE_DEVTOOLS = true# 是否打开调试工具devtoolsVITE_OPEN_DEVTOOLS = true# 是否删除生产环境consoleVITE_DROP_CONSOLE = true# DeepSeek API配置VITE_DEEPSEEK_API_KEY = 替换为你的 API KeyVITE_DEEPSEEK_BASE_URL = https://api.deepseek.com

登录后复制项目入口配置main.js代码语言：actionscript复制

import { createApp } from 'vue'import './style.scss'import App from './App.vue'import { launchApp } from '@/windows/actions'// 引入路由/状态配置import Router from './router'import Pinia from './pinia'// 引入插件配置import Plugins from './plugins'launchApp().then(config => {  if(config) {// 全局存储窗口配置    window.config = config  }  // 初始化app实例  createApp(App)  .use(Router)  .use(Pinia)  .use(Plugins)  .mount('#app')})

登录后复制

立即进入“豆包AI人工智官网入口”；

立即学习“豆包AI人工智能在线问答入口”；

项目框架模板

立即进入“豆包AI人工智官网入口”；

立即学习“豆包AI人工智能在线问答入口”；

代码语言：actionscript复制

登录后复制

当历史聊天对话超过一定高度后，会出现滚动条。

路由配置文件

立即进入“豆包AI人工智官网入口”；

立即学习“豆包AI人工智能在线问答入口”；

代码语言：actionscript复制

import { createRouter, createWebHashHistory } from 'vue-router'import { authState } from '@/pinia/modules/auth'import Layout from '@/layouts/index.vue'import { loginWindow } from '@/windows/actions'// 批量导入路由const modules = import.meta.glob('./modules/*.js', { eager: true })const patchRouters = Object.keys(modules).map(key => modules[key].default).flat()/** * meta配置 * @param meta.requireAuth 需登录验证页面 */const routes = [  ...patchRouters,  // 错误模块  {    path: '/:pathMatch(.*)*',    redirect: '/404',    component: Layout,    meta: {      title: '404 error',    },    children: [      {        path: '404',        component: () => import('@/views/error/404.vue'),      }    ]  },]const router = createRouter({  history: createWebHashHistory(),  routes,})// 全局路由钩子拦截router.beforeEach((to, from) => {  const authstate = authState()  // 登录验证  if(to?.meta?.requireAuth && !authstate.authorization) {    // console.log('你还未登录!')    loginWindow()  }})router.afterEach(() => {  // ...})router.onError(error => {  console.warn('[Router Error]', error)})export default router

登录后复制编辑框模板

立即进入“豆包AI人工智官网入口”；

立即学习“豆包AI人工智能在线问答入口”；

代码语言：actionscript复制

登录后复制

立即进入“豆包AI人工智官网入口”；

立即学习“豆包AI人工智能在线问答入口”；

热文推荐

相关攻略

热门推荐