在线对话生成器

「在线对话生成器」是一个可让你自定义生成聊天截图、Nice图、动图的 Web 应用。它能够高度模拟主流聊天软件的界面,帮你快速制作出有意思的对话图片或视频。


功能特点

  • 📱 模拟聊天界面 --- 还原真实的手机聊天 UI,支持气泡样式、头像、昵称、时间戳等细节
  • 🖼️ 图片导出 --- 支持生成静态图片(Nice图)、动态图片(GIF)以及视频(MP4)
  • 🎨 丰富自定义 --- 可自由配置聊天双方的头像、昵称、消息内容、发布时间、主题配色等
  • 💾 本地存储 --- 自动保存你的创作记录,数据保存在浏览器本地 storage 中
  • 🌐 桌面端支持 --- 通过 Tauri 打包,可作为独立桌面应用运行在 Windows、macOS、Linux 系统上

技术栈

分类 技术
前端框架 Vue 3 + Composition API
构建工具 Vite
状态管理 Pinia
桌面封装 Tauri
样式 Less

安装

复制代码
npm install

运行

复制代码
npm run serve

运行成功后,在浏览器访问 http://localhost:5173 (端口以实际输出为准)。


打包

打包前,请确认已将 .env.production 中的 VITE_BASE_PATH 修改为 /,否则可能导致资源路径错误。

复制代码
npm run build

打包完成后,产物位于 dist 目录中,可直接部署到任意静态服务器。

如需生成桌面端应用,请在 tauri 目录下执行:

复制代码
cd tauri
cargo tauri build

项目结构

复制代码
src/
├── assets/          # 静态资源(图标、字体、图片素材)
├── components/     # Vue 组件
│   ├── common/      # 全局可复用组件
│   └── phone/      # 手机聊天界面相关组件
├── hooks/          # 自定义组合式函数
├── store/          # Pinia 状态仓库
│   └── modules/    # 各模块 store
└── utils/          # 工具函数
tauri/              # Tauri 桌面端项目

传送门

masonwu21/ChatEmu

相关推荐
科创致远20 小时前
科创致远 ESD 静电监控系统实景效果展示
信息可视化
weixin_4404016920 小时前
质朴的可视化绘图+pyecharts
开发语言·python·信息可视化·pyecharts
计算机毕业设计杰瑞2 天前
【最新原创大数据】基于大数据的酒店数据分析与可视化,附源码_高质量项目_可视化_数据分析_毕设选题推荐_SPark_Hadoop_毕设指导
大数据·信息可视化·数据挖掘·课程设计
计算机毕业设计杰瑞2 天前
【2027最新精品大数据】基于大数据的全国各地景点指数数据可视化分析,附源码_高质量项目_可视化_数据分析_毕设选题推荐_SPark_Hadoop_毕设指导
大数据·信息可视化·数据分析
Highcharts.js2 天前
可视化商用图表库对比,如何选择?
前端·javascript·学习·信息可视化·highcharts·前端可视化
计算机毕业设计杰瑞2 天前
【2027精品大数据项目】基于大数据的全球太空探索数据分析与可视化,附源码_数据可视化_数据分析_毕设选题_SPark_Hadoop_文档指导ppt
大数据·信息可视化·数据挖掘·课程设计
计算机毕业设计杰瑞2 天前
【2027最新原创大数据】基于大数据的无人机自主导航数据分析与可视化,附源码_数据可视化_数据分析_数据挖掘_Hadoop_spark_文档指导_毕设指导
大数据·信息可视化·数据挖掘·课程设计
计算机毕业设计杰瑞2 天前
【2027原创精品大数据】基于大数据的电商销售数据可视化分析系统,附源码_数据可视化_数据分析_数据挖掘_Hadoop_spark_文档指导_毕设指导
大数据·信息可视化·数据挖掘
计算机毕业设计杰瑞2 天前
【2027最新原创大数据】基于大数据的广西医疗机构及药店清单可视化分析,附源码_数据可视化_数据分析_数据挖掘_Hadoop_spark_文档指导_毕设指导
大数据·信息可视化·数据挖掘
计算机毕业设计杰瑞2 天前
【2027最新原创大数据】基于大数据的二手房成交信息分析与可视化,附源码_数据可视化_数据分析_数据挖掘_Hadoop_spark_文档指导_毕设指导
大数据·信息可视化·数据挖掘