littlebot
Published on 2025-04-03 / 1 Visits
0

【源码】基于Vue3和ElementPlus框架的迅排设计项目

项目简介

本项目是一款基于Vue3和ElementPlus框架构建的在线海报设计工具,适用于多种设计场景,如海报图片生成、电商分享图、文章长图、视频/公众号封面等,为用户提供功能强大且操作简便的海报设计体验。

项目的主要特性和功能

  1. 丝滑的操作体验,具备丰富交互细节与完善基础功能,设计过程流畅。
  2. 服务端生成图片,保证多端出图一致,支持各种CSS特性。
  3. 拥有简易的AI抠图功能,上传图片可一键去除背景。
  4. 支持PSD文件导入解析成模板,还能在线导出图片下载。
  5. 元素操作多样,包括拖拽、组合、缩放、层级调整、对齐等。
  6. 可对图片素材进行插入、替换、裁剪操作,具备图片容器功能。
  7. 支持SVG素材的颜色、透明度编辑,以及文字花字组合。
  8. 画布可自定义尺寸、滚轮缩放、自适应。
  9. 提供吸附对齐、辅助引导线、标尺等辅助工具。
  10. 支持键盘快捷键与右键菜单快捷操作。
  11. 支持单色、渐变、自定义logo等风格的二维码编辑。

安装使用步骤

1. 拉取源码

推荐使用 Node.js v16.18 以上版本。 bash cd poster-design

2. 安装依赖

bash npm run prepared 若网络较慢,可更改 npm 仓库源为国内镜像源后再安装。

3. 本地运行

bash npm run serve 运行后,前端界面和图片生成服务将同时启动。前端界面可通过访问 http://127.0.0.1:3000/ 查看,图片生成服务端口为 7001

4. 打包部署

  • 前端页面打包:使用 npm run v-build 命令。
  • 截图服务打包:查看 /screenshot 目录下的 README 文件。

5. 服务端部署

根据具体场景自行实现后端接口,参考 API 文档 进行接口对接。

6. 抠图服务部署

通过 Docker 部署抠图服务: bash docker run -d -p 5000:5000 --restart always danielgatis/rembg s

下载地址

点击下载 【提取码: 4003】【解压密码: www.makuang.net】