重磅自研Electron41+Vite8.0手搓DeepSeek电脑版AI智能系统

举报
yxybox 发表于 2026/03/27 21:17:17 2026/03/27
【摘要】 基于最新跨平台技术Electron41+Vite8+Vue 3 + DeepSeek打造一个支持流式输出的 桌面客户端 AI 对答系统。

2026年最新款研发electron41+vite8.0+deepseek-v3.2+arco客户端流式AI输出对答系统。


未标题-p6.png

360截图20260325000410395.png

p2.gif


项目知识框架

编辑器:vscode
跨平台框架:electron^41.0.3
前端框架:vite^8.0.1+vue^3.5.30+vue-router^5.0.4
大模型框架:deepseek-v3.2+openai
组件库:arco-design^2.57.0
状态管理:pinia^3.0.4
markdown解析:markdown-it^14.1.1
打包工具:electron-builder^26.8.1
vite桥接electron插件:vite-plugin-electron^0.29.1


p3.gif

未标题-p3.png


项目特色

  1. 基于Electron41+Vite8接入DeepSeek流式打字输出,丝滑流畅
  2. 内置light+dark主题
  3. 支持深度思考R1模式
  4. 支持Latex数学公式
  5. 支持Mermaid图表渲染(拖拽、缩放、下载)
  6. 支持代码块sticky浮动粘性、横向滚动、代码高亮/复制/下载代码
  7. 支持上下文多轮对话、本地存储会话
  8. 支持链接跳转、图片预览功能


360截图20260325080241821.png

360截图20260325080511380.png


项目框架目录

使用vite8+electron搭建跨平台模板,对接deepseek api大模型,采用vue3 setup语法开发。


360截图20260324234537590.png


electron41-vite8-ai客户端ai系统已经正式发布到我的原创小店,欢迎下载使用。

https://b23.tv/zu7OIH8


360截图20260325000934350.png

360截图20260325001444834.png

360截图20260325080714582.png

360截图20260325081350542.png

360截图20260325081439439.png

360截图20260325082121881.png


项目运行配置

替换下项目根目录下.env文件里的deepseek apikey为自己申请的key,即可体验丝滑流式对话功能。

  • 安装依赖 yarn install 
  • 运行项目 yarn dev 
  • 打包项目 yarn electron:build 


360截图20260324234727442.png


对接deepseek api智能大模型

const completion = await openai.chat.completions.create({
  // 单一会话
  /* messages: [
    {role: 'user', content: editorValue}
  ], */
  // 多轮会话
  messages: props.multiConversation ? historySession.value : [{role: 'user', content: editorValue}],
  // deepseek-chat对话模型 deepseek-reasoner推理模型
  model: sessionstate.thinkingEnabled ? 'deepseek-reasoner' : 'deepseek-chat',
  stream: true, // 流式输出
  max_tokens: 8192, // 限制一次请求中模型生成 completion 的最大 token 数(默认使用 4096)
  temperature: 0.4, // 严谨采样
})

项目公共布局

<script setup>
  import { appState } from '@/pinia/modules/app'

  import Titlebar from '@/layouts/components/titlebar/index.vue'
  import Sidebar from '@/layouts/components/sidebar/index.vue'

  const appstate = appState()
</script>

<template>
  <div class="vu__chatbot">
    <div class="vu__container" :style="{'--themeSkin': appstate.config.skin}">
      <div class="vu__layout flexbox flex-col">
        <!-- 导航栏 -->
        <Titlebar />

        <div class="vu__layout-body flex1 flexbox">
          <!-- 侧边栏 -->
          <Sidebar />

          <!-- 主面板 -->
          <div class="vu__layout-main flex1">
            <router-view v-slot="{ Component, route }">
              <keep-alive>
                <component :is="Component" :key="route.path" />
              </keep-alive>
            </router-view>
          </div>
        </div>
      </div>
    </div>
  </div>
</template>

360截图20260325080241821.png

360截图20260325080511380.png

360截图20260325081027315.png

360截图20260325082528060.png

360截图20260325083110708.png

360截图20260325083314481.png

360截图20260325085608555.png

360截图20260325085608557.png

360截图20260325092701644.png

360截图20260325093305664.png

360截图20260325093305668.png

360截图20260325094001893.png

360截图20260325094231244.png

360截图20260325094258473.png

360截图20260325095513143.png


基于electron41+vite8+deepseek搭建桌面端ai流式聊天对话就分享到这里,感谢阅读与支持!

2026最新款Uniapp+DeepSeek+mphtml纯手撸跨三端ai流式输出模板

2026重磅爆肝tauri2.10+vite7.3+openai集成deepseek桌面客户端AI智能系统

首发vite8.0+vue3+deepseek+markdown手搓网页版ai流式生成模板

最新研发electron38+vite7.0+vue3客户端仿微信EXE聊天软件

Electron38.2实战客户端OS系统|vite7+vue3+electron仿mac/wins桌面

2025最新款Electron38+Vite7+Vue3+ElementPlus桌面客户端后台管理系统Exe

原创uniapp+vite5+vue3+uv-ui跨三端短视频+直播+聊天app应用

2025最新款Tauri2.9+Vite7+Vue3+ElementPlus电脑端后台管理系统Exe

最新版Vite7.1+Tauri2.8+Vue3电脑端仿QQ/微信聊天程序

Flutter3.32实战桌面端OS系统|flutter3仿macOS桌面

flutter3.27跨平台仿微信客户端聊天Exe程序|朋友圈|短视频

flutter3+deepseek手机端ai流式输出聊天模板

2025最新版Flutter3.38+Dart3.10+Get纯手撸抖音APP直播+短视频+聊天程序

【声明】本内容来自华为云开发者社区博主,不代表华为云及华为云开发者社区的观点和立场。转载时必须标注文章的来源(华为云社区)、文章链接、文章作者等基本信息,否则作者和本社区有权追究责任。如果您发现本社区中有涉嫌抄袭的内容,欢迎发送邮件进行举报,并提供相关证据,一经查实,本社区将立刻删除涉嫌侵权内容,举报邮箱: cloudbbs@huaweicloud.com
  • 点赞
  • 收藏
  • 关注作者

评论(0

0/1000
抱歉,系统识别当前为高风险访问,暂不支持该操作

全部回复

上滑加载中

设置昵称

在此一键设置昵称,即可参与社区互动!

*长度不超过10个汉字或20个英文字符,设置后3个月内不可修改。

*长度不超过10个汉字或20个英文字符,设置后3个月内不可修改。