gulp
Image verlustfreie Komprimierung (mit gulp-imagemin)

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


Syntax

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

Parameter

Streit Beschreibung
sourcePath Quellverzeichnis der Bilder (zum Beispiel: /assets/images )
buildPath Zielpfad (zum Beispiel: /static/dist/ )

Bemerkungen

Das erste Argument für den imagemin Konstruktor ist das Plugin-Array. Standardmäßig werden folgende Plugins verwendet: [imagemin.gifsicle(), imagemin.jpegtran(), imagemin.optipng(), imagemin.svgo()]

Zweites Argument sind Optionen. Im obigen Beispiel werden folgende Optionen verwendet: 

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

Das ist völlig optional.

progressive wird von imagemin-jpegtran .

interlaced wird von imagemin-gifsicle .

removeUnknownsAndDefaults und cleanupIDs werden von imagemin-svgo .

Installation und Verwendung

Installation der Abhängigkeit ( https://www.npmjs.com/package/gulp-imagemin ) 

$ npm install --save-dev gulp-imagemin

Verwendungszweck 

/*
 * 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
Lizenziert unter CC BY-SA 3.0
Nicht angeschlossen an Stack Overflow