CI/CD für JavaScript-Projekte: GitHub Actions – vollständiger Leitfaden

Einleitung: Warum CI/CD für JavaScript-Projekte unerlässlich ist

Die Entwicklung einer modernen JavaScript-Anwendung auf Node.js ist ein komplexer Prozess, der Schreiben von Code, Testen, Bauen und Bereitstellen umfasst. Ohne Automatisierung werden diese Schritte manuell durchgeführt, was zu Fehlern, Verzögerungen und geringerer Produktqualität führt. CI/CD (Continuous Integration / Continuous Delivery) ist eine DevOps-Praxis, die das Bauen, Testen und Bereitstellen von Code automatisiert.

GitHub Actions ist ein integriertes GitHub-Tool, mit dem Sie Workflows zur Aufgabenautomatisierung erstellen können. Es ist ideal für JavaScript-Projekte, da es Node.js, npm, Yarn und viele beliebte Dienste unterstützt. In diesem Artikel werden wir aufschlüsseln, wie Sie eine vollständige CI/CD-Pipeline für Ihr JavaScript-Projekt mit GitHub Actions einrichten.

Sie werden lernen: wie man Tests ausführt, wie man die Anwendung baut, wie man auf einen Server oder eine Cloud-Plattform bereitstellt und wie man häufige Fehler vermeidet.

GitHub Actions Grundlagen für JavaScript

Was ist GitHub Actions?

GitHub Actions ist eine Plattform zur Automatisierung von Workflows. Sie beschreiben eine Abfolge von Schritten in einer YAML-Datei, die im Repository abgelegt wird (normalerweise .github/workflows/main.yml). Jedes Mal, wenn ein Ereignis eintritt (z.B. Push, Pull-Request), wird der Workflow ausgelöst.

Ein Workflow besteht aus Jobs, die auf einem Runner (einer virtuellen Maschine) ausgeführt werden. Für JavaScript-Projekte wird typischerweise ein Ubuntu-Runner mit vorinstalliertem Node.js verwendet.

Grundlegender Workflow für Node.js

Beginnen wir mit einem einfachen Workflow, der bei jedem Push oder Pull-Request Tests ausführt. Erstellen Sie eine Datei .github/workflows/ci.yml:

name: CI für JavaScript

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

jobs:  test:    runs-on: ubuntu-latest

    strategy:      matrix:        node-version: [16.x, 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'    - run: npm ci    - run: npm test    - run: npm run build --if-present

Dieser Workflow tut Folgendes:

• Auslöser: läuft bei Push auf main/develop oder bei Pull-Request auf main.
• Versionsmatrix: testet auf Node.js 16, 18, 20 — dies gewährleistet Kompatibilität.
• Caching: cache: 'npm' beschleunigt die Installation von Abhängigkeiten.
• Befehle: npm ci (saubere Installation), npm test (Tests), npm run build (Bau, falls vorhanden).

Einrichten einer vollständigen CI/CD-Pipeline

Jetzt machen wir es komplexer: fügen Sie Linting, Sicherheitsüberprüfungen und automatische Bereitstellung nach erfolgreichem Testen hinzu.

Schritt 1: Linting und Formatierung

Fügen Sie einen Job für ESLint und Prettier hinzu. Dies gewährleistet einen einheitlichen Codestil:

jobs:  lint:    runs-on: ubuntu-latest    steps:    - uses: actions/checkout@v4    - uses: actions/setup-node@v4      with:        node-version: '18.x'        cache: 'npm'    - run: npm ci    - run: npm run lint    - run: npx prettier --check .

In package.json sollten die Skripte "lint" und "format" vorhanden sein. Beispiel:

{  "scripts": {    "lint": "eslint src/",    "format": "prettier --write ."  }}

Schritt 2: Abhängigkeitssicherheit

Verwenden Sie npm audit, um auf Schwachstellen zu prüfen:

  security:    runs-on: ubuntu-latest    steps:    - uses: actions/checkout@v4    - run: npm audit --audit-level=high

Wenn