本文档详细介绍了 roadmap.sh 项目中使用的构建和部署流程。它涵盖了如何为生产环境构建代码库、部署工作流以及自动化这些流程的持续集成管道。
roadmap.sh 平台使用一套精简的构建和部署系统,从源代码生成静态文件并将其部署到生产服务器。该系统包含几个关键组件:
来源: package.json7-31 .github/workflows/deployment.yml1-75 astro.config.mjs1-76
构建过程以 Astro 为中心,Astro 是一个现代化的静态网站生成器。配置在 astro.config.mjs 中定义,包括站点元数据、重定向、Vite 配置和集成插件的设置。
关键配置要素包括:
server 用于服务器端渲染项目使用了 package.json 文件中定义的几个自定义脚本来辅助构建过程:
| 脚本 | 目的 |
|---|---|
build | 生成生产文件的主构建命令 |
generate-renderer | 从 web-draw 仓库生成路线图渲染器 |
compress:images | 优化生产图像 |
generate:roadmap-content-json | 将路线图内容处理为 JSON 格式 |
roadmap-content | 处理路线图内容文件 |
最重要的构建步骤是路线图渲染器生成,这由 generate-renderer.sh 脚本处理。该脚本:
web-draw 仓库(如果尚未存在)来源: package.json7-31 scripts/generate-renderer.sh1-26 scripts/editor-roadmap-content-json.ts1-185
部署过程通过 GitHub Actions 自动化,并在 .github/workflows/deployment.yml 文件中定义。工作流包含以下几个步骤:
仓库检出和环境设置
配置准备
构建过程
部署到 EC2
缓存失效
来源: .github/workflows/deployment.yml1-75
除了主要的部署工作流外,该仓库还实现了几个持续集成工作流,以确保内容保持最新并维护依赖关系:
路线图内容 JSON 刷新
依赖升级
这些自动化工作流有助于在无需人工干预的情况下维护代码库的新鲜度和安全性。
来源: .github/workflows/refresh-roadmap-content-json.yml1-52 .github/workflows/upgrade-dependencies.yml1-52
对于本地开发,项目在贡献指南中提供了具体说明:
此设置确保开发人员拥有与生产构建系统相同的环境,从而保持环境之间的一致性。
构建和部署系统与几个关键目录和文件交互:
| 路径 | 目的 |
|---|---|
/dist | 构建文件的输出目录 |
/src | 源代码和内容 |
/public | 原样提供静态文件 |
/scripts | 构建和部署脚本 |
/packages/editor | 路线图编辑器组件 |
/.github/workflows | CI/CD 工作流定义 |
内容和构建脚本的分离确保了平台内容创建和技术基础设施方面之间的清晰界限。
来源: .gitignore5-7 scripts/generate-renderer.sh1-26
roadmap.sh 平台的构建和部署系统采用了现代实践,如自动化 GitHub 工作流、优化的构建流程和持续集成,以维持可靠的用户体验。配置旨在易于维护和扩展,并具有清晰的职责分离和重复任务的自动化。
使用 Astro 作为构建框架,并结合用于特殊需求的自定义脚本,为向用户交付路线图内容创建了一个灵活而强大的系统。