Come installare GulpJS su Ubuntu 20.04

In questo tutorial, ti mostreremo come installare GulpJS su Ubuntu 20.04. Imparerai a configurare GulpJS per minimizzare i file Javascript su Ubuntu.

GulpJS è un toolkit che ti aiuta ad automatizzare attività dolorose o che richiedono tempo nel tuo flusso di lavoro di sviluppo. Le integrazioni sono integrate in tutti i principali IDE e le persone utilizzano gulp con PHP, .NET, Node.js, Java e altre piattaforme.

Usa i moduli npm per fare tutto ciò che vuoi + oltre 3000 plugin curati per le trasformazioni di file in streaming. Fornendo solo una superficie API minima, gulp è facile da imparare e semplice da usare.

Prerequisiti

• Server dedicato Ubuntu 20.04
• Un utente root o un utente normale con privilegi di amministratore sudo.

Passaggio 1 - Mantieni aggiornato il server

# apt update -y

# apt upgrade -y

Passaggio 2: installa build-essential

# apt-get install build-essential -y

Passaggio 3: installa NodeJS e NPM

Installa l'ultima versione stabile di NodeJS.

# curl -sL https://deb.nodesource.com/setup_14.x | sudo -E bash -

# apt-get install -y nodejs

Verificare che l'installazione sia andata a buon fine.

# node -v && npm -v

Produzione:

v14.14.0
6.14.8

Passaggio 4 - Installa GulpJS CLI

Installa la CLI GulpJS usando il seguente comando:

# npm install -g gulp-cli

Verificare che l'installazione sia andata a buon fine.

# gulp -v

Impostare

Per utilizzare GulpJS con i plugin è necessario un   file gulpfile.js e un   file package.json .

• gulpfile.js: configura, pipe ed esegue attività insieme alla gestione dei plugin.
• package.json: tiene traccia delle dipendenze e delle loro versioni.

Vai alla directory del tuo progetto.

# cd /path/to/project/

Inizializza un ambiente NPM per creare un  package.json :

Quando viene richiesto il nome del pacchetto, utilizzare  gulpjs . Premi  INVIO  per accettare la risposta predefinita per tutte le altre domande. Successivamente, dovresti vedere questo riepilogo.

About to write to /root/package.json:

{
"name': "gulpjs',
"version': "1.0.0',
"description': "',
"main': "index.js',
"scripts': {
"test': "echo \'Error: no test specified\' && exit 1″
},
"author': "',
"license': "ISC'
}

Is this OK? (yes)

Digitare  yes  e premere  INVIO .

Installa il  pacchetto gulp locale  e il   plugin gulp-uglify .

# npm install --save-dev gulp gulp-uglify

Creare il compito gulp

Crea un  gulpfile.js  nella radice del progetto.

# vi gulpfile.js

Importare le librerie, quindi definire un'attività. L'attività di esempio è denominata  exampleTask.

const gulp = require('gulp'); // Import Gulp
const uglify = require('gulp-uglify'); // Import Gulp Uglify (Javascript minify)

gulp.task('exampleTask', ()=>{ // define a task
return gulp.src('/path/to/javascript/files/*.js') // source a directory full of anything ending with .js
.pipe(uglify()) // minify the stream
.pipe(gulp.dest('/path/to/destination/')); // send files to a destination
});

Assicurati che ci sia almeno un file javascript in  /path/to/javascript/files/ :

# ls /path/to/javascript/files/

Produzione:

file.js

Esegui l'attività.

# gulp exampleTask

Produzione:

Working directory changed to ~
Using gulpfile ~/gulpfile.js
Starting 'exampleTask’…
Finished 'exampleTask' after 59 ms

/path/to/destination/  contiene il file minimizzato.

# ls /path/to/destination/

Produzione:

file.js

Abbiamo installato con successo GulpJS.

In questo tutorial, ti abbiamo mostrato come installare GulpJS su Ubuntu 20.04.