Come eseguire, configurare e risolvere i problemi relativi agli script npm

2023/01/29

Gli script npm raggruppano una serie di comandi di terminale che puoi utilizzare per automatizzare le attività in un progetto JavaScript. Forniscono inoltre un modo coerente di eseguire i comandi in ambienti diversi.

Puoi configurare gli script npm in un file package.json, eseguirli sulla riga di comando e utilizzare un’ampia gamma di opzioni per configurarne il comportamento.

Configurazione degli script npm nel file package.json

In genere definisci gli script npm in un file package.json, che si trova nella radice del tuo progetto JavaScript. Questo non è un must in quanto puoi eseguire script da altri file, ma package.json semplifica l’accesso e la gestione dei tuoi script.

Tieni presente che devi avere npm e Node installati nel tuo ambiente di sviluppo per continuare. Ecco alcuni articoli utili:

Come installare Node.js e npm su Windows.
Come installare Node.js e npm su Ubuntu.

Per configurare uno script npm in package.json, procedi nel seguente modo:

Passa alla radice del tuo progetto.
Eseguire npm init sul terminale. Il comando ti farà alcune domande sul tuo progetto. Rispondi per creare un file package.json appropriato.npm init
Nel file package.json individuare il campo degli script. Qui puoi aggiungere il nome di uno script e il comando che dovrebbe essere eseguito come coppie chiave/valore. Ad esempio, lo script seguente, denominato hello-world, stampa “Hello world” nel terminale quando viene eseguito.{ "scripts": { "hello-world": "echo \\"Hello world\\"" } }

Ecco alcuni script comuni per i progetti JavaScript:

start : questo script avvia il server di sviluppo. Ad esempio, in un progetto Node, può eseguire il server utilizzando nodemon.
build : genera il codice di produzione per la tua applicazione e può utilizzare uno strumento come webpack per minimizzare e raggruppare il codice.
test : questo script esegue i test definiti nel progetto. Può eseguire un framework di test come Jest.
lint : uno script lint esegue uno strumento di lint come ESLint per verificare la presenza di potenziali errori nel codice.
watch : questo script osserva il codice sorgente per le modifiche e quindi esegue un comando. È utile per eseguire nuovamente i test o ricostruire l’applicazione in caso di modifica del codice.
deploy : esegue un comando che distribuisce l’applicazione nell’ambiente specificato come la produzione o lo staging.

Pre e post script

npm supporta pre e post script. Gli script pre vengono eseguiti prima di uno script specifico mentre gli script post vengono eseguiti successivamente. Puoi creare script pre e post per qualsiasi script, basta aggiungere il prefisso “pre” o “post” al nome dello script.

Ad esempio, di seguito sono riportati gli script pretest e posttest che verranno eseguiti rispettivamente prima e dopo lo script di test.

{ "scripts": { "pretest": "npm run lint", "test": "jest", "posttest": "npm run build" } }

Esecuzione di script npm da package.json

Dopo aver aggiunto uno script npm a package.json, puoi eseguirlo utilizzando il comando npm run.

Ecco la sintassi:

npm run <script-name>

Ad esempio, per eseguire lo script di avvio definito in precedenza, utilizzare:

npm run start

Puoi eseguire il comando npm run da solo, per ottenere l’elenco di tutti gli script disponibili in un progetto. Ecco alcuni esempi di output:

Scripts available in npm-scripts-demo@1.0.0 via `npm run-script`: hello-world echo "Hello world"

Elenca il nome dello script e il comando che esegue.

Utilizzo di comandi abbreviati per eseguire script incorporati

npm supporta diversi script integrati che puoi eseguire utilizzando comandi abbreviati. Ad esempio, per eseguire uno script npm denominato start, puoi utilizzare npm start, invece di npm run start.

Questo è più comodo e veloce che digitare il comando completo. Altri script integrati che puoi eseguire in questo modo includono “test”, “stop” e “restart”.

Esecuzione di più script npm

Puoi eseguire più script npm in due modi:

In sequenza
In parallelo

Se stai utilizzando Linux o qualsiasi altro sistema simile a Unix, puoi utilizzare i metodi standard per eseguire più comandi contemporaneamente.

Per eseguire più script npm in sequenza utilizzare &&, ad esempio:

npm run start && npm test

Per eseguire più script npm in parallelo utilizzare &, ad esempio:

npm run server & npm run client

In ambienti non UNIX è possibile utilizzare il comando npm-run-all o il pacchetto concurrently npm.

Usando npm-run-all:

npm-run-all --parallel server client

Utilizzo simultaneo in package.json.

"scripts": { "dev": "concurrently \\"npm run server\\"\\"npm run client\\"", }

Si noti che è necessario installare i pacchetti npm-run-all e Concurrently prima di utilizzarli.

Risoluzione dei problemi relativi agli errori comuni degli script Npm

Di seguito sono riportati alcuni errori comuni che potresti riscontrare durante l’esecuzione di script npm:

npm err! script mancante : questo errore si verifica quando non hai definito lo script che stai tentando di eseguire nel file package.json. Assicurati di scrivere correttamente il nome dello script e che sia definito nel campo degli script del file package.json.
Autorizzazione negata : questo errore si verifica quando non si dispone dell’autorizzazione per eseguire uno script, quindi assicurarsi di disporre delle autorizzazioni corrette.
Dipendenze mancanti : questo errore si verifica quando lo script utilizza un pacchetto non installato. Utilizzare uno strumento come depcheck per verificare la presenza di dipendenze mancanti da package.json, quindi installarle utilizzando npm install.
Comando sconosciuto : questo errore si verifica in genere quando si esegue uno script personalizzato come comando npm integrato. Assicurati di utilizzare npm run o npm run-script durante l’esecuzione di script personalizzati.

Utilizzo delle variabili d’ambiente negli script npm

Le variabili di ambiente consentono di passare informazioni senza codificarle. Per utilizzare le variabili di ambiente in uno script npm, puoi utilizzare il pacchetto npm cross-env . Questo strumento ti aiuta a impostare una variabile ambientale in qualsiasi ambiente.

Inizia eseguendo questo comando sul terminale per installarlo come dipendenza dev:

npm i save -D cross-env

Quindi usalo nel tuo script in questo modo:

{ "scripts": { "build": "cross-env NODE_ENV=production webpack" } }

Qui, cross-env imposta la variabile NODE_ENV su “produzione”.

Passaggio di argomenti della riga di comando agli script

È possibile passare argomenti della riga di comando a uno script npm utilizzando due trattini “–” dopo il nome dello script. Ad esempio, il seguente comando esegue lo script di test con l’argomento watch:

npm run test -- --watch

Puoi anche inviare un argomento della riga di comando a uno script npm come questo:

npm run my-port --PORT=3000

Quindi accedervi nello script come segue.

"scripts": { "my-port": "echo \\"Port: $npm_config_PORT\\"" }

Su un sistema Windows, usa questo:

"scripts": { "my-port": "echo \\"Port: %npm_config_PORT%\\"" }

Lo script dovrebbe stampare “Port: 3000” quando lo esegui.

Perché usare gli script npm?

È possibile aggiungere script a package.json, eseguirli sulla riga di comando, utilizzare hook pre e post e passare loro argomenti di riga e variabili di ambiente.

Gli script npm sono un modo potente per automatizzare le attività nei progetti JavaScript. Possono migliorare il tuo flusso di lavoro e farti risparmiare tempo fornendoti comandi coerenti per eseguire più attività.