CI/CD pour les projets TypeScript : configuration de GitHub Actions de zéro

Introduction au CI/CD pour les projets TypeScript

Le développement logiciel moderne est impensable sans automatisation. Le CI/CD (Continuous Integration / Continuous Delivery) est une pratique qui permet aux équipes de développement de livrer rapidement et en toute sécurité des changements en production. Pour les projets TypeScript, en particulier dans l'écosystème Node.js, la configuration d'un pipeline CI/CD devient une tâche cruciale.

Dans cet article, nous allons voir comment configurer un pipeline CI/CD complet pour un projet TypeScript à l'aide de GitHub Actions. Vous apprendrez à automatiser l'exécution des tests, la compilation du projet et le déploiement vers un hébergeur. Ce contenu est destiné aux développeurs qui connaissent déjà TypeScript et souhaitent adopter les pratiques modernes de DevOps.

Qu'est-ce que GitHub Actions et pourquoi est-il pratique pour TypeScript

GitHub Actions est un système CI/CD intégré qui permet de créer des workflows automatisés directement dans un dépôt GitHub. Les principaux avantages :

• Limite gratuite — 2000 minutes de build par mois pour les dépôts publics.
• Intégration avec GitHub — pas besoin de configurer des services tiers.
• Flexibilité — prend en charge tous les langages, y compris TypeScript, via l'exécution de commandes shell.
• Grand écosystème — des actions prêtes à l'emploi pour le déploiement sur AWS, Vercel, Netlify et d'autres plateformes.

Pour les projets TypeScript, GitHub Actions est idéal car il permet d'exécuter facilement des commandes npm ou yarn, d'utiliser la mise en cache des dépendances et des tâches parallèles.

Structure de base d'un fichier workflow

Un workflow dans GitHub Actions est décrit dans des fichiers YAML stockés dans le répertoire .github/workflows/. Voici une configuration minimale pour un projet TypeScript.

Créez le fichier .github/workflows/ci.yml :

name: CI 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:      - name: Checkout repository        uses: actions/checkout@v4

      - name: Setup Node.js ${{ matrix.node-version }}        uses: actions/setup-node@v4        with:          node-version: ${{ matrix.node-version }}

      - name: Install dependencies        run: npm ci

      - name: Lint check        run: npm run lint

      - name: Type check        run: npx tsc --noEmit

      - name: Run tests        run: npm test

      - name: Build project        run: npm run build

Analyse des éléments clés :

• on — les déclencheurs d'exécution (push sur main/develop, pull request).
• runs-on — le système d'exploitation pour l'exécution (ubuntu-latest).
• matrix — exécution parallèle sur différentes versions de Node.js (18 et 20).
• actions/checkout — l'action standard pour cloner le dépôt.
• actions/setup-node — installation de la version spécifiée de Node.js.
• npm ci — installation propre des dépendances à partir du fichier lock (plus rapide et plus fiable que npm install).

Ajout de la mise en cache pour accélérer la compilation

Pour ne pas télécharger les dépendances à chaque fois, ajoutez la mise en cache :

      - name: Cache Node.js modules        uses: actions/cache@v3        with:          path: ~/.npm          key: ${{ runner.os }}-node-${{ hashFiles('**/package-lock.json') }}          restore-keys: |            ${{ runner.os }}-node-

Cette étape met en cache ~/.npm en fonction du hash de package-lock.json. Lors d'une exécution ultérieure, si les dépendances n'ont pas changé, le cache sera restauré, ce qui permettra d'économiser 30 à 60 secondes.