本文最后更新于34 天前,其中的信息可能已经过时,如有错误请发送邮件到[email protected]
SVGcode 是一个超好用的 SVG 优化工具,能把位图转成高质量矢量图。今天教大家用 Zeabur 快速部署自己的 SVGcode 实例,全程不到5分钟,零服务器运维经验也能搞定。
一、前置准备
- 一个 GitHub 账号
- 一个 Zeabur 账号(推荐直接用 GitHub 一键登录)
- 本地安装 Git 和 Node.js 18+ LTS 版本
二、Fork 代码到自己仓库
1. 打开 SVGcode 原仓库:https://github.com/joachimesque/SVGcode
2. 点击页面右上角的 Fork 按钮,将仓库复制到你的 GitHub 账号下
3. 本地测试(可选但推荐):
git clone https://github.com/你的用户名/SVGcode.git
cd SVGcode && npm install && npm start浏览器打开 http://localhost:3000 确认能正常运行。
1. 登录 Zeabur 控制台,点击左上角 + 新建项目,选择新加坡区域(国内访问最快)
2. 进入项目后,点击 + 添加服务 → GitHub
3. 授权 Zeabur 访问你的仓库,然后选择刚才 Fork 的 SVGcode 仓库
4. 关键配置(必须改对,否则100%部署失败):配置项 必须填写的值
构建命令 npm install && npm run build
输出目录 dist
启动命令 npx serve -s dist -l 3000
端口 3000
5. 点击底部 部署 按钮,等待1-2分钟,部署成功后点击生成的 .zeabur.app 域名即可访问。
小技巧
- 自动部署:默认开启,以后只要往 GitHub main 分支推送代码,Zeabur 会自动重新构建部署
- 自定义域名:在服务的「域名」标签页添加你的域名,按提示配置 CNAME 解析即可
- 中文翻译:按照仓库说明复制 en-US.js 翻译为 zh-CN.js ,修改 i18n.js 后提交代码,自动部署中文版本
小结
部署自己的 SVGcode 实例其实非常简单,只需要 Fork 代码 + 几个简单的 Zeabur 配置,就能拥有一个随时可用、自动更新的私有png转svg工具。
不仅不用操心服务器运维,还可以根据自己的需求添加中文翻译或其他功能。现在就动手试试吧!



































