Come pubblicare su NPM utilizzando le GitHub action

Parole
Pierdomenico Reitano
Immagini
Corinna Stacchini
Tempo di lettura
5

Le GitHub Actions permettono di automatizzare tanti processi a seguito di un’azione fatta su un repository di progetto, vediamo come.

U

Generare un nuovo token su NPM

Nella vita dell’area tech di una digital agency, la pubblicazione di pacchetti NPM può essere una necessità molto impellente.
Per prima cosa abbiamo bisogno di creare un nuovo token che useremo per pubblicare il nostro modulo su NPM.

Dalla dashboard di NPM andiamo sul menù principale e selezioniamo “Access Token”, poi clicchiamo su “Generate new token”.

6kd3phl8qnlt7u12hn55

Selezioniamo “Automation” per bypassare l’autenticazione a due fattori quando avviene la pubblicazione.

84caxmk7f7fn8dc7jj8k

Successivamente copiamo il nostro token che verrà poi utilizzato come GitHub secret.

jvq0dblsbi40w8b4i69n

Salviamo il nostro token come GitHub secret.

Le GitHub Actions possono accedere alle GitHub secrets, posto ideale in cui salvare il nostro token!

In "Settings" -> "Secrets" clicchiamo su "New repository secret" aggiungiamo il nostro token NPM che abbiamo precedentemente copiato (in questo esempio useremo come nome NPM_TOKEN)

fn55nojstxu272gceq04

Adesso è il momento di scrivere un po’ di codice per creare una nuova action che permetta di pubblicare il nostro modulo!

Scriviamo la nostra Action

Create a new GitHub Action publish.yml inside your project under .github/workflows.
Creiamo un file chiamato publish.yml dentro il nostro progetto sotto .github/workflows, conterrà il codice della nostra Action.

name: Publish to NPM
on:
  release:
    types: [created]
jobs:
  build:
    runs-on: ubuntu-latest
    steps:
      - name: Checkout
        uses: actions/checkout@v2
      - name: Setup Node
        uses: actions/setup-node@v2
        with:
          node-version: '14.x'
          registry-url: 'https://registry.npmjs.org'
      - name: Install dependencies and build 🔧
        run: npm install && npm run build
      - name: Publish package on NPM 📦
        run: npm publish
        env:
          NODE_AUTH_TOKEN: ${{ secrets.NPM_TOKEN }}

Questa Action dovrà essere eseguita ogni volta che faremo una nuova release su GitHub.

on:
  release:
    types: [created]

Gli step che vengono eseguiti sono molto chiari:

  • checkout del codice
  • Setup dell’ambiente Node.js (in questo esempio utilizziamo Node.js 14.x)
  • Installazione delle eventuali dipendenze e Build del modulo
  • Pubblicazione su NPM, come potete vedere questo step utilizza la nostra secret NPM_TOKEN per inizializzare la variabile di ambiente NODE_AUTH_TOKEN
  - name: Publish package to NPM 📦
        run: npm publish
        env:
          NODE_AUTH_TOKEN: ${{ secrets.NPM_TOKEN }}

Creiamo una nuova release!

Per vedere la nostra nuova action in azione dobbiamo creare una nuova release su GitHub.

wjtkj6lxke8erg7yqopi

Adesso il nostro modulo è stato pubblicato su NPM 🎉.

Analizza la tua presenza online.

Scrivici per una consulenza gratuita



Richiedi consulenza

Pierdomenico Reitano

Senior Fullstack Developer

Ho iniziato ad approcciarmi con il mondo del web non appena finite le scuole superiori, una mia amica mi disse che frequentava una scuola di web design, così senza pensarci troppo mi iscrissi e fu amore a prima ...