TypeScript 项目的 CI/CD：GitHub Actions

引言：为什么 CI/CD 对 TypeScript 项目至关重要

现代 TypeScript 开发不仅需要高质量的代码，还需要一个可靠的流程来将代码交付给用户。手动运行测试、构建和部署不仅繁琐，而且是错误的来源。CI/CD（持续集成/持续部署）通过自动化每个阶段解决了这个问题。

在本文中，我们将逐步讲解如何使用 GitHub Actions 为 TypeScript 项目设置完整的 CI/CD 流水线。你将学习如何自动化代码检查、测试、构建和部署应用程序，从而节省大量工作时间。

本文是为 PythonLib 平台编写的，但所有示例和概念都适用于任何 TypeScript 项目。我们将使用 TypeScript 5.x 和 Node.js 20。

主体部分：逐步设置 CI/CD

1. 项目结构与准备

在编写工作流程之前，请确保你的 TypeScript 项目已正确配置。以下是最小结构：

my-typescript-app/├── src/│   └── index.ts├── tests/│   └── index.test.ts├── package.json├── tsconfig.json├── .eslintrc.json└── .github/    └── workflows/        └── ci.yml

重要提示：package.json 必须定义了用于测试和构建的脚本。

{  "name": "my-typescript-app",  "version": "1.0.0",  "scripts": {    "build": "tsc",    "test": "jest",    "lint": "eslint src/**/*.ts",    "start": "node dist/index.js"  },  "devDependencies": {    "typescript": "^5.3.0",    "jest": "^29.7.0",    "@types/jest": "^29.5.0",    "ts-jest": "^29.1.0",    "eslint": "^8.50.0"  }}

确保 tsconfig.json 包含正确的 outDir（例如 "./dist"）并启用 strict 模式。

2. 创建 GitHub Actions 工作流程

GitHub Actions 基于 .github/workflows/ 目录下的 YAML 文件运行。创建一个包含以下内容的 ci.yml 文件：

name: CI/CD Pipeline

on:  push:    branches: [ main, develop ]  pull_request:    branches: [ main ]

jobs:  build-and-test:    runs-on: ubuntu-latest

    strategy:      matrix:        node-version: [18.x, 20.x]

    steps:    - uses: actions/checkout@v4

    - name: Use Node.js ${{ matrix.node-version }}      uses: actions/setup-node@v4      with:        node-version: ${{ matrix.node-version }}        cache: 'npm'

    - name: Install dependencies      run: npm ci

    - name: Lint code      run: npm run lint

    - name: Build project      run: npm run build

    - name: Run tests      run: npm test

    - name: Upload build artifacts      uses: actions/upload-artifact@v4      with:        name: build-${{ matrix.node-version }}        path: dist/

关键点说明：

• on： 工作流程在推送到主分支和开发分支以及向主分支发起拉取请求时运行。
• matrix： 我们在两个 Node.js 版本（18 和 20）上进行测试，以确保兼容性。
• npm ci： 干净安装依赖项（比 npm install 更快、更可靠）。
• upload-artifact： 我们保存构建好的文件，用于后续部署。

3. 添加部署阶段

在成功构建和测试之后，你可以自动部署应用程序。让我们来看看部署到 GitHub Pages（用于静态站点）和通过 SSH 部署到 VPS 的方法。

选项 A：部署到 GitHub Pages

deploy:  needs: build-and-test  runs-on: ubuntu-latest  if: github.ref == 'refs/heads/main'

  steps:  - uses: actions/download-artifact@v4    with:      name: build-20.x      path: dist/

  - name: Deploy to GitHub Pages    uses