gulpを用いた画像の圧縮(imagemin)
Q&A
解決したいこと
gulpを用いて画像の圧縮を自動化したい。
ここに質問の内容を詳しく書いてください。
gulp-imagemin、imagemin-mozjpeg、imagemin-pngquant、gulp-changedを使い画像の軽量化を行いたい。
発生している問題・エラー
現在gulp-imagemin以外をコメントアウトした場合に画像軽量化はできている。
SyntaxError: Invalid regular expression: /^.*?\((?<label>.*?)[,)]/: Invalid group
at Object.<anonymous> (C:\Users\ADC005\Desktop\imgauto\node_modules\ow\dist\source\index.js:1:26679)
at r (C:\Users\ADC005\Desktop\imgauto\node_modules\ow\dist\source\index.js:1:186)
at Object.module.exports.r (C:\Users\ADC005\Desktop\imgauto\node_modules\ow\dist\source\index.js:1:11962)
at r (C:\Users\ADC005\Desktop\imgauto\node_modules\ow\dist\source\index.js:1:186)
at module.exports.Object.defineProperty.value (C:\Users\ADC005\Desktop\imgauto\node_modules\ow\dist\source\index.js:1:985)
at Object.<anonymous> (C:\Users\ADC005\Desktop\imgauto\node_modules\ow\dist\source\index.js:1:994)
at Module._compile (module.js:652:30)
at Object.Module._extensions..js (module.js:663:10)
at Module.load (module.js:565:32)
at tryModuleLoad (module.js:505:12)
該当するソースコード
gulpfile.js
const gulp = require("gulp");
// 画像を圧縮するプラグインの読み込み
const imagemin = require("gulp-imagemin");
const mozjpeg = require("imagemin-mozjpeg");
const pngquant = require("imagemin-pngquant");
const changed = require("gulp-changed");
// srcImgフォルダのjpg,png画像を圧縮して、distImgフォルダに保存する
gulp.task("default", function() {
gulp.src("src/*.{png,jpg}") // srcImgフォルダ以下のpng,jpg画像を取得する
.pipe(changed("dist")) // srcImg と distImg を比較して異なるものだけ圧縮する
.pipe(imagemin())
.pipe(
imagemin([
pngquant({
quality: [.7, .85], // 画質
speed: 1 // スピード
}),
mozjpeg({
quality: 85, // 画質
})
])
)
.pipe(gulp.dest("dist")); //保存
});
自分で試したこと
エラーメッセージをみるとnodeのバージョンが古いことが考えられた為バージョンをいろいろ変更したがだめだった。
バージョン関係
gulp -v
CLI version: 2.3.0
Local version: 3.9.1
node -v
v8.11.1
ご回答よろしくお願いいたします。
0 likes