Rumah > hujung hadapan web > tutorial js > Membina Tindakan CI/CD Cross-Platform dengan Docker

Membina Tindakan CI/CD Cross-Platform dengan Docker

DDD
Lepaskan: 2025-01-30 00:31:09
asal
933 orang telah melayarinya

Building Cross-Platform CI/CD Actions with Docker

Minggu lepas saya terkena sakit kepala - aliran kerja Lingo.Dev GitHub yang sempurna tidak dapat dijalankan pada contoh Gitlab penyumbang. Kemudian saya menyedari bahawa saya sebenarnya ingin menjalankan automasi yang sama di mana -mana, tanpa mengira platform.

Jadi saya meneruskan usaha untuk membina automasi CI cross-platform yang berjalan di GitHub, Gitlab, dan Bitbucket (dan mungkin juga yang lain!). Penyelesaian ini bermula sebagai tindakan GitHub yang mudah tetapi berkembang menjadi sesuatu yang lebih kuat apabila kita perlu menyokong pelbagai platform hosting kod.

saya akan membimbing anda melalui proses yang tepat:

  1. Bermula dengan mudah, saya akan mempamerkan bagaimana tindakan GitHub berfungsi
  2. meratakan untuk membina imej dock yang boleh diguna semula
  3. Akhirnya saya akan menunjukkan kepada anda bagaimana untuk menjalankan ini pada setiap platform

Ikuti langkah-langkah untuk membina dan menghantar tindakan silang platform pertama anda. Atau penanda artikel untuk kemudian.

tl; dr melihat repositori templat ???

1. Bermula Sederhana: Jalankan JavaScript dalam Tindakan GitHub

Menjalankan tindakan github

mari kita mulakan dengan tindakan GitHub yang paling mudah - yang menjalankan fail JavaScript. Pertama, buat indeks.js dalam akar repositori anda:

console.log("Hello World");

Salin selepas log masuk
Salin selepas log masuk
Salin selepas log masuk
Salin selepas log masuk
Salin selepas log masuk

Sekarang buat fail aliran kerja .Github/aliran kerja/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

Salin selepas log masuk
Salin selepas log masuk
Salin selepas log masuk

Tindakan ini akan:

  1. Pencetus pada Push ke Cawangan Utama
  2. lihat repositori anda
  3. Sediakan persekitaran node.js
  4. Jalankan skrip anda

Menjadikannya boleh diguna semula

Sekarang, mari kita buat tindakan ini boleh diguna semula dengan memindahkannya ke repositori yang berasingan. Buat repositori GitHub baru (mis., Hello-world-action seperti contoh saya di sini) dengan fail-fail ini:

  1. index.js (sama seperti sebelumnya):
console.log("Hello World");

Salin selepas log masuk
Salin selepas log masuk
Salin selepas log masuk
Salin selepas log masuk
Salin selepas log masuk
  1. action.yml:
name: "Hello World Action"
description: "A simple action that says hello"
runs:
  using: "node20"
  main: "index.js"

Salin selepas log masuk
Salin selepas log masuk

Sekarang anda boleh menggunakan tindakan ini di mana -mana repositori dengan merujuknya dalam aliran kerja anda:

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

Salin selepas log masuk
Salin selepas log masuk

perbezaan utama ialah:

  1. tindakan hidup dalam repositori sendiri
  2. action.yml mentakrifkan cara menjalankan tindakan
  3. repositori lain boleh merujuknya menggunakan penggunaan: nama-username/hello-world-action@ref

2. Menyatakan: Tindakan TypeScript Dockerized

Sekarang, mari kita buat tindakan yang lebih canggih yang menjalankan kod TypeScript. Kami memerlukan beberapa fail:

  1. Inisialisasi projek dan sediakan TypeScript:

    pnpm init                # Creates package.json
    pnpm add -D typescript   # Install TypeScript as dev dependency
    
    
    Salin selepas log masuk
    Salin selepas log masuk
  2. Kemas kini pakej.json anda untuk menambah skrip binaan:

    {
      "scripts": {
        "build": "tsc"
      }
    }
    
    
    Salin selepas log masuk
    Salin selepas log masuk
  3. kemudian menamakan semula index.js kami ke index.ts untuk menggunakan TypeScript dan bukannya JavaScript dan gerakkannya ke direktori SRC.

  4. Buat tsconfig.json untuk mengkonfigurasi kompilasi TypeScript:

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

console.log("Hello World");

Salin selepas log masuk
Salin selepas log masuk
Salin selepas log masuk
Salin selepas log masuk
Salin selepas log masuk
  1. Mengkaji semula tindakan dalam 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

Salin selepas log masuk
Salin selepas log masuk
Salin selepas log masuk

Running Docker Image Secara tempatan

Untuk membina dan menjalankan imej yang ditakrifkan di Dockerfile secara tempatan, anda memerlukan aplikasi desktop Docker. Kemudian, dengan mengandaikan Docker berjalan secara tempatan, anda boleh:

  1. Bina imej:
console.log("Hello World");

Salin selepas log masuk
Salin selepas log masuk
Salin selepas log masuk
Salin selepas log masuk
Salin selepas log masuk
  1. Jalankannya:
name: "Hello World Action"
description: "A simple action that says hello"
runs:
  using: "node20"
  main: "index.js"

Salin selepas log masuk
Salin selepas log masuk

3. Sokongan Cross-Platform

kini datang bahagian yang paling menarik - menjalankan tindakan anda pada platform lain. Kita perlu:

  1. Bina dan tolak imej Docker kami ke pendaftaran
  2. merujuknya dalam konfigurasi khusus platform

Membina dan menerbitkan gambar Docker

Pertama, buat aliran kerja untuk membina dan menolak imej Docker pada setiap pelepasan. Kami akan menggunakan GitHub Container Registry (GHCR) yang dilengkapi dengan GitHub anda (percuma untuk repositori awam, 500MB untuk repositori swasta dalam pelan percuma).

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

Salin selepas log masuk
Salin selepas log masuk

Tindakan GitHub

Untuk menggunakan tindakan ini dalam tindakan github repositori lain, buat fail aliran kerja di .github/aliran kerja/hello.yml (lihat GitHub Actions Workflow Syntax Documentation):

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

Salin selepas log masuk
Salin selepas log masuk

Jika anda perlu menjalankan tindakan ini pada tindakan GitHub sahaja, tidak perlu membina dan menolak imej Docker. Tindakan GitHub akan membina bekas Docker secara langsung dari Dockerfile yang dinyatakan dalam fail Action.yml anda pada setiap aliran kerja yang dijalankan. Ini lebih cekap kerana ia mengelakkan langkah -langkah tambahan untuk menolak dan menarik dari pendaftaran kontena. Walau bagaimanapun, jika anda merancang untuk menggunakan tindakan ini pada platform CI lain seperti GitLab atau Bitbucket, anda perlu menerbitkan imej Docker seperti yang ditunjukkan di atas.

Pelan percuma Github menawarkan peruntukan minit CI/CD yang paling murah hati di kalangan tiga platform. Ia termasuk:

  • minit tanpa had untuk repositori awam
  • 2,000 minit/bulan untuk repositori swasta

Konfigurasi Gitlab CI

3


Pelan percuma GitLab anda termasuk 400 CI/CD mengira minit setiap bulan tanpa mengira jika repositori itu awam atau swasta.
{
  "scripts": {
    "build": "tsc"
  }
}

Salin selepas log masuk
Salin selepas log masuk

Bitbucket Pipelines

Buat bitbucket-pipelines.yml (lihat dokumentasi Pipelin Bitbucket):


Pelan percuma Bitbucket termasuk hanya 50 minit membina sebulan, tanpa mengira jika repositori adalah awam atau swasta, menjadikannya tahap bebas terendah bagi ketiga -tiga platform.
{
  "compilerOptions": {
    "target": "ES2022",
    "module": "commonjs",
    "outDir": "./build",
    "rootDir": "./src",
    "strict": true,
    "esModuleInterop": true,
    "skipLibCheck": true,
    "forceConsistentCasingInFileNames": true
  },
  "exclude": ["node_modules", "build", "**/*.test.ts"]
}

Salin selepas log masuk
Salin selepas log masuk
Platform CI/CD lain

Sejak kami menerbitkan imej Docker kami dalam pendaftaran kontena GitHub awam, kami boleh menjalankan ini di mana -mana platform yang menyokong imej Docker. Ini disokong oleh:

Circle Ci (Docs)

    travis ci (docs)
  • beritahu saya jika anda menjalankan ini di tempat lain, saya ingin tahu mengenai kes penggunaan anda!

  • ? Apa yang boleh anda lakukan dengan ini?

    Kami membina tindakan untuk menjalankan lokalisasi lingo.dev automatik untuk aplikasi web dan mudah alih anda di mana -mana platform CI. Pada setiap komit ia mengemas kini terjemahan di seluruh repositori anda menggunakan enjin lokalisasi lingo.dev - sama ada sebagai komit baru atau dengan membuka permintaan tarik (docs).

    Contoh untuk GitHub:

console.log("Hello World");

Salin selepas log masuk
Salin selepas log masuk
Salin selepas log masuk
Salin selepas log masuk
Salin selepas log masuk

anda boleh membina tindakan yang boleh diguna semula dan mudah mengintegrasikannya ke dalam aliran kerja anda tanpa mengira platform hosting kod yang anda gunakan. Berikut adalah beberapa idea untuk anda:

  • Wartawan Ujian Cross-Platform (Sesi Ujian End-to-End Mengatur)
  • Pemeriksa Kualiti Kod Custom (berfikir pemformatan, linting, ujian)
  • Penjana Nota Siaran (Bagaimana dengan menerbitkan changelog di laman web anda?)

apa yang akan anda gunakan untuknya?

? Bonus: Templat Repositori

Jika anda tidak merasa seperti membaca artikel yang lain, anda boleh mencari repositori starter templat dengan semua kod di sini. Ia mengandungi tindakan - anda boleh menjalankannya di GitHub, Gitlab dan Bitbucket.

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

? Petua: Klon repo dan jadikannya titik permulaan untuk tindakan anda sendiri:

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

Salin selepas log masuk
Salin selepas log masuk
Salin selepas log masuk

... atau hanya buat repositori baru dari templat saya.

kemudian melaksanakan logik tindakan anda sendiri dalam fail src/index.ts.

Kesimpulan

Kami telah melihat bagaimana untuk berkembang dari tindakan GitHub berasaskan shell yang mudah ke tindakan typescript yang canggih yang boleh berjalan di mana-mana sahaja. Pengambilan kunci adalah:

  1. Mulakan mudah dengan arahan shell untuk mengesahkan logik automasi anda
  2. dockerize tindakan anda untuk menjadikannya mudah alih
  3. Gunakan pendaftaran kontena untuk mengedarkan tindakan anda di seluruh platform
  4. menyesuaikan konfigurasi untuk setiap platform sambil mengekalkan logik teras dalam Docker

Pendekatan ini memberi anda fleksibiliti untuk menjalankan automasi anda di mana -mana sahaja sambil mengekalkan asas kod tunggal. Selamat mengautomasikan!


Saya kadang -kadang menyiarkan mengenai perkara teknologi dan ciri lingo.dev baru di Twitter sebagai @Mathio28. Mari kita terus berhubung.

Atas ialah kandungan terperinci Membina Tindakan CI/CD Cross-Platform dengan Docker. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!

sumber:dev.to
Kenyataan Laman Web ini
Kandungan artikel ini disumbangkan secara sukarela oleh netizen, dan hak cipta adalah milik pengarang asal. Laman web ini tidak memikul tanggungjawab undang-undang yang sepadan. Jika anda menemui sebarang kandungan yang disyaki plagiarisme atau pelanggaran, sila hubungi admin@php.cn
Tutorial Popular
Lagi>
Muat turun terkini
Lagi>
kesan web
Kod sumber laman web
Bahan laman web
Templat hujung hadapan