gulp
画像ロスレス圧縮（gulp-imagemin）

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

構文

imagemin（[plugins]、{options}）

パラメーター

引数	説明
`sourcePath`	イメージのソースディレクトリ（例： `/assets/images` ）
`buildPath`	宛先パス（例： `/static/dist/` ）

備考

imageminコンストラクタの第一引数はプラグイン配列です。デフォルトでは、以下のプラグインが使用されます： [imagemin.gifsicle(), imagemin.jpegtran(), imagemin.optipng(), imagemin.svgo()]

第二引数はオプションです。上記の例では、以下のオプションが使用されています：

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

これらは完全にオプションです。

progressiveはimagemin-jpegtranによって使用されます。

interlacedは、 imagemin-gifsicleによって使用されます。

removeUnknownsAndDefaultsおよびcleanupIDsは、 imagemin-svgoによって使用されます。

インストールと使用

依存関係のインストール （ https://www.npmjs.com/package/gulp-imagemin ）

$ npm install --save-dev gulp-imagemin

使用法

/*
 * 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

ライセンスを受けた CC BY-SA 3.0

所属していない Stack Overflow