Construire des actions CI / CD multiplateforme avec Docker

La semaine dernière, j'ai été frappé par un mal de tête - notre workflow Lingo.Dev GitHub Actions parfaitement réglé n'a pas pu fonctionner sur l'instance GitLab d'un contributeur. Ensuite, j'ai réalisé que j'aimerais vraiment exécuter la même automatisation partout, quelle que soit la plate-forme.

Alors j'ai fait une quête pour construire une automatisation CI multiplateforme qui fonctionne sur Github, Gitlab et Bitbucket (et peut-être d'autres aussi!). La solution a commencé comme une simple action github mais a évolué en quelque chose de plus puissant lorsque nous devions prendre en charge plusieurs plates-formes d'hébergement de code.

Je vous guiderai à travers le processus exact:

1. Commencer simple, je vais montrer comment les actions GitHub fonctionnent
2. niveler vers le haut pour construire une image docker réutilisable
3. Enfin, je vais vous montrer comment exécuter ceci sur chaque plate-forme

Suivez les étapes pour construire et expédier votre première action multiplateforme. Ou en signet l'article pour plus tard.

tl; dr voir le référentiel du modèle ???

1. Démarrage Simple: Exécutez JavaScript dans les actions GitHub

Exécuter une action github

Commençons par l'action GitHub la plus simple possible - celle qui exécute un fichier JavaScript. Tout d'abord, créez index.js dans la racine de votre référentiel:

console.log("Hello World");

Créez maintenant un fichier de workflow .github / workflows / hello.yml:

name: Hello World
on:
  push:
    branches:
      - main

jobs:
  hello:
    runs-on: ubuntu-latest
    steps:
      - uses: actions/checkout@v4
      - uses: actions/setup-node@v4
        with:
          node-version: "20"
      - name: Say Hello
        run: node index.js

Cette action sera:

1. Déclencher sur Push to Main Branch
2. Consultez votre référentiel
3. Configurer l'environnement Node.js
4. Exécutez votre script

Rendre le réutilisable

Maintenant, rendons cette action réutilisable en le déplaçant vers un référentiel séparé. Créez un nouveau référentiel GitHub (par exemple, Hello-World-Action comme mon exemple ici) avec ces fichiers:

1. index.js (comme avant):

console.log("Hello World");

1. action.yml:

name: "Hello World Action"
description: "A simple action that says hello"
runs:
  using: "node20"
  main: "index.js"

Maintenant, vous pouvez utiliser cette action dans n'importe quel référentiel en le faisant référence dans votre flux de travail:

name: Use Hello Action
on:
  push:
    branches:
      - main

jobs:
  hello:
    runs-on: ubuntu-latest
    steps:
      - name: Say Hello
        uses: your-username/hello-world-action@main

Les principales différences sont:

1. L'action vit dans son propre référentiel
2. action.yml définit comment exécuter l'action
3. D'autres référentiels peuvent le référencer en utilisant des utilisations: votre-username / hello-world-action @ ref

2. Augmentation vers la hausse: action dockerisée

Maintenant, créons une action plus sophistiquée qui exécute le code TypeScript. Nous aurons besoin de plusieurs fichiers:

1. Initialiser le projet et configurer TypeScript:
   

   pnpm init                # Creates package.json
   pnpm add -D typescript   # Install TypeScript as dev dependency
   
   

2. Mettez à jour votre package.json pour ajouter le script de construction:
   

   {
     "scripts": {
       "build": "tsc"
     }
   }
   
   

3. puis renommer notre index.js à index.ts pour utiliser TypeScript au lieu de JavaScript et le déplacer vers le répertoire SRC.

4. Créer tsconfig.json pour configurer la compilation TypeScript:
   

   {
     "compilerOptions": {
       "target": "ES2022",
       "module": "commonjs",
       "outDir": "./build",
       "rootDir": "./src",
       "strict": true,
       "esModuleInterop": true,
       "skipLibCheck": true,
       "forceConsistentCasingInFileNames": true
     },
     "exclude": ["node_modules", "build", "**/*.test.ts"]
   }
   
   

5. Créer un dockerfile:
   

console.log("Hello World");

1. Redéfinir l'action en action.yml:

name: Hello World
on:
  push:
    branches:
      - main

jobs:
  hello:
    runs-on: ubuntu-latest
    steps:
      - uses: actions/checkout@v4
      - uses: actions/setup-node@v4
        with:
          node-version: "20"
      - name: Say Hello
        run: node index.js

Entraînement Docker Image localement

Pour créer et exécuter l'image définie dans DockerFile localement, vous avez besoin de l'application Docker Desktop. Ensuite, en supposant que Docker s'exécute localement, vous pouvez:

1. Construisez l'image:

console.log("Hello World");

1. Exécutez-le:

name: "Hello World Action"
description: "A simple action that says hello"
runs:
  using: "node20"
  main: "index.js"

3. Support multiplateforme

vient maintenant la partie la plus intéressante - exécuter votre action sur d'autres plateformes. Nous devions:

1. Créez et poussez notre image Docker vers un registre
2. la référence dans les configurations spécifiques à la plate-forme

Construire et publier l'image docker

Tout d'abord, créez un workflow pour construire et pousser l'image Docker à chaque version. Nous utiliserons GitHub Container Registry (GHCR) fourni avec votre github (gratuit pour les référentiels publics, 500 Mo pour les référentiels privés sur le plan gratuit).

name: Use Hello Action
on:
  push:
    branches:
      - main

jobs:
  hello:
    runs-on: ubuntu-latest
    steps:
      - name: Say Hello
        uses: your-username/hello-world-action@main

Actions github

Pour utiliser cette action dans les actions GitHub d'un autre référentiel, créez un fichier de workflow dans .github / workflows / hello.yml (voir GitHub Actions Workflow Syntax Documentation):

pnpm init                # Creates package.json
pnpm add -D typescript   # Install TypeScript as dev dependency

Si vous avez besoin d'exécuter cette action sur les actions GitHub uniquement, il n'est pas nécessaire de construire et de pousser l'image Docker. GitHub Actions créera le conteneur Docker directement à partir du DockerFile spécifié dans votre fichier Action.yml sur chaque exécution de workflow. Ceci est plus efficace car il évite les étapes supplémentaires de pousser et de tirer d'un registre de conteneurs. Cependant, si vous prévoyez d'utiliser cette action sur d'autres plates-formes CI comme GitLab ou Bitbucket, vous devrez publier l'image Docker comme indiqué ci-dessus.

Le plan gratuit de Github offre l'allocation de minutes CI / CD la plus généreuse entre les trois plates-formes. Il comprend:

• Procès-verbal illimité pour les référentiels publics
• 2 000 minutes / mois pour les référentiels privés

Configuration GitLab CI

Créer .gitLab-Ci.yml (voir la documentation Gitlab CI / CD):

{
  "scripts": {
    "build": "tsc"
  }
}

Votre plan gratuit Gitlab comprend 400 minutes de calcul CI / CD par mois, peu importe si le référentiel est public ou privé.

Pipelines bitbucket

Créer Bitbucket-Pipelines.yml (voir Bitbucket Pipelines Documentation):

{
  "compilerOptions": {
    "target": "ES2022",
    "module": "commonjs",
    "outDir": "./build",
    "rootDir": "./src",
    "strict": true,
    "esModuleInterop": true,
    "skipLibCheck": true,
    "forceConsistentCasingInFileNames": true
  },
  "exclude": ["node_modules", "build", "**/*.test.ts"]
}

Le plan gratuit de Bitbucket ne comprend que 50 minutes de construction par mois, peu importe si le référentiel est public ou privé, ce qui en fait le niveau libre le plus bas des trois plateformes.

Autres plateformes CI / CD

Puisque nous avons publié notre image Docker dans un registre public GitHub Container, nous pouvons exécuter cela sur n'importe quelle plate-forme qui prend en charge les images Docker. Ceci est pris en charge par:

• cercle CI (docs)
• Travis CI (docs)

Faites-moi savoir si vous exécutez cela ailleurs, je suis curieux de savoir votre cas d'utilisation!

---

? Que pouvez-vous faire avec ça?

Nous avons construit une action pour exécuter la localisation de Lingo.Dev automatisée pour vos applications Web et mobiles sur n'importe quelle plate-forme CI. Sur chaque engagement, il met à jour les traductions dans l'ensemble de votre référentiel à l'aide du moteur de localisation Lingo.Dev - soit en tant que nouveau commit, soit en ouvrant une demande de traction (docs).

Exemple pour github:

console.log("Hello World");

---

Vous pouvez créer des actions réutilisables et les intégrer facilement dans vos workflows quelle que soit la plate-forme d'hébergement de code que vous utilisez. Voici quelques idées pour vous:

• Reporter de test de plate-forme multiplate (Session de test de bout en bout)
• Contrôle de qualité de code personnalisé (pensez à la mise en forme, à la libellur, aux tests)
• Générateur de notes de sortie (que diriez-vous de publier un modiage sur votre site Web?)

pour quoi l'utiliseriez-vous?

? Bonus: référentiel de modèle

Si vous n'avez pas envie de lire le reste de l'article, vous pouvez trouver un référentiel de démarrage de modèle avec tout le code ici. Il contient l'action - vous pouvez l'exécuter sur github, gitlab et bitbucket.

https://github.com/mathio/awesome-action-starter

? Astuce: cloner le repo et faire un point de départ pour votre propre action:

name: Hello World
on:
  push:
    branches:
      - main

jobs:
  hello:
    runs-on: ubuntu-latest
    steps:
      - uses: actions/checkout@v4
      - uses: actions/setup-node@v4
        with:
          node-version: "20"
      - name: Say Hello
        run: node index.js

… ou créez simplement un nouveau référentiel à partir de mon modèle.

Ensuite, implémentez simplement votre propre logique d'action dans le fichier src / index.ts.

Conclusion

Nous avons vu comment évoluer d'une simple action GitHub basée sur des shell à une action dactylographiée sophistiquée qui peut s'exécuter n'importe où. Les principaux plats sont les suivants:

1. Démarrez simple avec des commandes shell pour valider votre logique d'automatisation
2. docker votre action pour le rendre portable
3. Utilisez des registres de conteneurs pour distribuer votre action sur les plates-formes
4. Adaptez la configuration pour chaque plate-forme tout en gardant la logique principale dans Docker

Cette approche vous donne la flexibilité d'exécuter votre automatisation n'importe où tout en maintenant une seule base de code. Bonne automatisation!

---

Je publie occasionnellement sur les trucs technologiques et les nouvelles fonctionnalités Lingo.Dev sur Twitter en tant que Mathio28. Ressons en contact.

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!