Gulp - Plugin utili
Gulp fornisce alcuni plugin utili per lavorare con HTML e CSS, JavaScript, grafica e altre cose come descritto nelle tabelle seguenti.
Plugin HTML e CSS
Sr.No. | Plugin e descrizione |
---|---|
1 | autoprefixer Include automaticamente i prefissi alle proprietà CSS. |
2 | gulp-browser-sync Viene utilizzato per guardare tutti i file HTML e CSS nella directory CSS ed esegue il caricamento in tempo reale della pagina in tutti i browser, ogni volta che i file vengono modificati |
3 | gulp-useref Viene utilizzato per sostituire i riferimenti a script o fogli di stile non ottimizzati. |
4 | gulp-email-design Crea modelli di email HTML che converte gli stili CSS in inline. |
5 | gulp-uncss Ottimizza i file CSS e trova gli stili inutilizzati e duplicati. |
6 | gulp-csso È un ottimizzatore CSS, che riduce al minimo i file CSS con conseguente dimensione del file inferiore. |
7 | gulp-htmlmin Riduce al minimo i file HTML. |
8 | gulp-csscomb Viene utilizzato per creare un formattatore di stile per CSS. |
9 | gulp-csslint Specifica un linter CSS. |
10 | gulp-htmlhint Specifica un validatore HTML. |
Plugin JavaScript
Sr.No. | Plugin e descrizione |
---|---|
1 | gulp-autopolyfiller È uguale all'autoprefixer che include i polyfill necessari per JavaScript. |
2 | gulp-jsfmt Viene utilizzato per la ricerca di frammenti di codice specifici. |
3 | gulp-jscs Viene utilizzato per controllare lo stile del codice JavaScript. |
4 | gulp-modernizr Specifica quali funzionalità HTML, CSS e JavaScript ha da offrire il browser dell'utente. |
5 | gulp-express Avvia il server web gulp express.js. |
6 | gulp-requirejs Utilizza require.js per combinare i moduli AMD require.js in un unico file. |
7 | gulp-plato Genera report di analisi della complessità. |
8 | gulp-complexity Analizza la complessità e la manutenibilità del codice. |
9 | fixmyjs Corregge i risultati di JSHint. |
10 | gulp-jscpd Viene utilizzato come rilevatore di copia / incolla per il codice sorgente. |
11 | gulp-jsonlint È un validatore JSON. |
12 | gulp-uglify Minifica i file JavaScript. |
13 | gulp-concat Concatena i file CSS. |
Plugin per i test delle unità
Sr.No. | Plugin e descrizione |
---|---|
1 | gulp-nodeunit Esegue test di unità di nodo da Gulp. |
2 | gulp-jasmine Viene utilizzato per segnalare le problematiche relative all'output. |
3 | gulp-qunit Fornisce l'output della console di base per i test QUnit e utilizza il modulo del nodo PhantomJS e il plug-in QUnit del runner PhantomJS. |
4 | gulp-mocha Specifica l'involucro sottile attorno a Mocha ed esegue i test Mocha. |
5 | gulp-karma È stato deprecato a Gulp. |
Plugin grafici
Sr.No. | Plugin e descrizione |
---|---|
1 | gulpicon Genera sprite da SVG e li converte in PNG. |
2 | gulp-iconfont Viene utilizzato con i caratteri Web per creare file WOFF, EOT, TTF da SVG. |
3 | gulp-imacss Trasforma i file immagine in URI di dati e li inserisce in un unico file CSS. |
4 | gulp-responsive Genera immagini reattive per diversi dispositivi
|
5 | gulp-sharp Viene utilizzato per modificare e ridimensionare l'orientamento e lo sfondo dell'immagine. |
6 | gulp-svgstore Combina i file SVG in uno con gli elementi <symbol>. |
7 | gulp-imagemin & gulp-tinypng Viene utilizzato per comprimere le immagini come PNG, JPEG, GIF, SVG. |
8 | gulp-spritesmith Viene utilizzato per creare un foglio sprite da un insieme di immagini e variabili CSS. |
Plugin dei compilatori
Sr.No. | Plugin e descrizione |
---|---|
1 | gulp-less Fornisce MENO plugin per Gulp. |
2 | gulp-sass Fornisce il plugin SASS per Gulp. |
3 | gulp-compass Fornisce plug-in bussola per Gulp. |
4 | gulp-stylus Viene utilizzato per mantenere lo stilo in CSS. |
5 | gulp-coffee Fornisce plugin coffeescript per Gulp. |
6 | gulp-handlebars Fornisce plugin per manubri per Gulp. |
7 | gulp-jst Fornisce modelli di sottolineatura in JST. |
8 | gulp-react Specifica i modelli di Facebook React JSX in JavaScript. |
9 | gulp-nunjucks Specifica i modelli Nunjucks in JST. |
10 | gulp-dustjs Specifica i modelli Dust in JST. |
11 | gulp-angular-templatecache Specifica i modelli AngularJS nella templateCache. |
Altri plugin
Il plug-in gulp-clean rimuove file e cartelle e il plug-in gulp-copy copia i file dall'origine alla nuova destinazione.
Sr.No. | Plugin e descrizione |
---|---|
1 | gulp-grunt Esegue le attività Grunt da Gulp
|
2 | gulp-watch Controlla i file ogni volta che vengono apportate modifiche. |
3 | gulp-notify Notifica il messaggio di errore ogni volta che un'attività non riesce. |
4 | gulp-git Permette di utilizzare i comandi Git. |
5 | gulp-jsdoc Crea documentazione JavaScript per Gulp. |
6 | gulp-rev Fornisce la revisione statica degli asset ai nomi dei file. |
7 | gulp-bump Aumenta le versioni nel pacchetto JSON. |
8 | gulp-bower-files Viene utilizzato per iniettare pacchetti bower. |
9 | gulp-removelogs Rimuove le istruzioni console.log. |
10 | gulp-preprocess Preelabora HTML, JavaScript e altri file in base al contesto o alla configurazione dell'ambiente. |
11 | gulp-duration Specifica la durata delle attività Gulp. |
12 | gulp-changed & gulp-newer Esegue i file modificati e quelli più recenti. |
13 | gulp-connect Viene utilizzato per eseguire un server Web con LiveReload. |
14 | gulp-shell Esegue i comandi della shell. |
15 | gulp-ssh Si connette utilizzando attività SSH e SFTP. |
16 | gulp-zip Comprime i file e le cartelle. |
17 | gulp-clean e gulp-copy |
18 | gulp-filesize Specifica la dimensione del file in formato leggibile dall'uomo. |
19 | gulp-util Fornisce utilità per i plugin gulp. |