Share
Cos'è Gulp? Una descrizione è che Gulp è un task runner. Un altro sarebbe che si tratta di un toolkit per automatizzare attività che richiedono tempo.
Qualunque cosa tu voglia chiamarla, c'è una caratteristica che rimane vera: l'automazione. Scaviamo un po 'più a fondo ...
Fondamentalmente, usi Gulp per automatizzare cose che normalmente dovresti fare manualmente, come compilare manualmente Sass, ottimizzare manualmente le immagini, aggiornare manualmente la tua pagina nel browser, e così via.
Bene, queste tre azioni possono essere consolidate in compiti indipendenti. Quindi dovresti prendere quei compiti e farli funzionare automaticamente da Gulp. Ecco perché strumenti come Gulp e Grunt sono chiamati task runner.
Una grossa differenza tra Gulp e gli altri task runner è il modo in cui gestisce le operazioni sui file. Gulp passerà essenzialmente un flusso di dati da un plugin all'altro senza effettivamente scrivere quel flusso in un file temporaneo tra queste attività. Questo è chiamato piping o streaming.
Se cerchi nel web una definizione per il piping, probabilmente otterrai qualcosa di molto tecnico. Quindi cercherò di semplificarlo un po '. Un flusso di lavoro Gulp funziona con diversi plugin che eseguono varie operazioni su determinati file.
Per fare un esempio, il plugin Sass prenderà un file Sass o SCSS e lo compila in un file CSS. Il plugin Uglify prenderà un normale file JavaScript e lo ridimensionerà.
Quindi la cosa con le piping è che puoi prendere un set di file ed eseguirli attraverso una serie di plugin o attraverso un plugin. E alla fine otterresti un diverso tipo di file, esattamente quello che ho detto con il plugin Sass. Si inizia con un file SCSS e si finisce con un file CSS.
Normalmente questi tipi di task runner scriveranno file temporanei sul disco. Bene, Gulp non lo fa, utilizza flussi di dati.
Quindi i contenuti di quel file sono effettivamente conservati in un buffer, è fondamentalmente un flusso di dati. Ed è appena passato dal plugin al plugin fino a raggiungere la sua destinazione finale. E tra questi plugin, quel flusso passa attraverso alcune modifiche.
Quindi, quello che puoi fare, per esempio, è iniziare con i file SCSS e passarli al plugin Sass. Ora, il plugin Sass accetta i file SCSS e restituisce i file CSS. Quindi il flusso di dati che si ottiene dopo il plugin Sass è diverso da quello che è entrato nel plugin.
E poi puoi fare più cose con quello. Forse li fai passare attraverso un autoprefixer, giusto? Quindi Gulp prenderà quel flusso di dati, e lo eseguirà attraverso il plugin autoprefixer, che accetta un file CSS. E restituisce anche quel file CSS, ma in mezzo aggiunge tutti i prefissi necessari del venditore. Quindi cambia anche il contenuto di quel file.
E infine, è possibile ridimensionarlo, ad esempio, oppure è possibile scriverlo su un disco. Quindi questo è essenzialmente il modo in cui funzionano le tubature. Passa i dati all'inizio dello stream e alla fine ottieni un tipo diverso di dati e al centro ci sono questi punti che eseguono determinate operazioni su quel flusso di dati.
Quindi spero tu ora abbia una comprensione di base di ciò che Gulp è. Per ottenere un'immagine più chiara, puoi seguire il corso completo, The Web Designer's Guide to Gulp, in cui illustriamo come Gulp funziona in modo molto più dettagliato.
Puoi seguire questo corso subito con un abbonamento a Envato Elements. Con una sola tariffa mensile bassa, puoi accedere non solo a questo corso, ma anche alla nostra libreria in crescita di oltre 1.000 corsi video e eBook leader del settore su Envato Tuts+.
Inoltre ora ottieni download illimitati dall'enorme libreria Envato Elements di oltre 440.000 asset creativi. Crea con caratteri, foto, grafica e modelli univoci e realizza progetti migliori più velocemente.
Accentsconagua