gulp
Kompresja bezstratna obrazu (z gulp-imagemin)

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


Składnia

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

Parametry

Argument Opis
sourcePath Katalog źródłowy obrazów (na przykład: /assets/images )
buildPath Ścieżka docelowa (na przykład: /static/dist/ )

Uwagi

Pierwszym argumentem konstruktora imagemin jest tablica wtyczek. Domyślnie używane są następujące wtyczki: [imagemin.gifsicle(), imagemin.jpegtran(), imagemin.optipng(), imagemin.svgo()]

Drugi argument to opcje. W powyższym przykładzie zastosowano następujące opcje: 

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

Te są całkowicie opcjonalne.

progressive jest używany przez imagemin-jpegtran .

interlaced jest używany przez imagemin-gifsicle .

removeUnknownsAndDefaults i cleanupIDs są używane przez imagemin-svgo .

Instalacja i użytkowanie

Instalacja zależności ( https://www.npmjs.com/package/gulp-imagemin ) 

$ npm install --save-dev gulp-imagemin

Stosowanie 

/*
 * 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
Licencjonowany na podstawie CC BY-SA 3.0
Nie związany z Stack Overflow