gulp
Compressione senza perdita di immagini (con gulp-imagemin)

Angular 2 AngularJS CSS HTML JavaScript Laravel Node.js PHP React TypeScript
Ricerca…


Sintassi

  1. imagemin ([plugins], {options})

Parametri

Discussione Descrizione
sourcePath Directory sorgente delle immagini (ad esempio: /assets/images )
buildPath Percorso di destinazione (ad esempio: /static/dist/ )

Osservazioni

Il primo argomento per imagemin constructor è l'array di plugin. Per impostazione predefinita, vengono utilizzati i seguenti plugin: [imagemin.gifsicle(), imagemin.jpegtran(), imagemin.optipng(), imagemin.svgo()]

Il secondo argomento sono le opzioni. Nell'esempio sopra riportato vengono utilizzate le seguenti opzioni: 

{
  progressive: true,
  interlaced: true,
  svgoPlugins: [{removeUnknownsAndDefaults: false}, {cleanupIDs: false}]
}

Quelli sono completamente opzionali.

progressive è usato da imagemin-jpegtran .

interlaced è usato da imagemin-gifsicle .

removeUnknownsAndDefaults e cleanupIDs sono usati da imagemin-svgo .

Installazione e utilizzo

Installazione delle dipendenze ( https://www.npmjs.com/package/gulp-imagemin ) 

$ npm install --save-dev gulp-imagemin

uso 

/*
 * Your other dependencies.
 */

var imagemin = require('gulp-imagemin');

/*
 * `gulp images` - Run lossless compression on all the images.
 */
gulp.task('images', function() {
  return gulp.src(sourcePath) // e.g. /assets/images
    .pipe(imagemin({
      progressive: true,
      interlaced: true,
      svgoPlugins: [{removeUnknownsAndDefaults: false}, {cleanupIDs: false}]
    }))
    .pipe(gulp.dest(buildPath + 'images')); // e.g. /static/dist/
});


Modified text is an extract of the original Stack Overflow Documentation
Autorizzato sotto CC BY-SA 3.0
Non affiliato con Stack Overflow