Nuxt.jsで画像をwebpで圧縮する
library install
npm install --save gulp-webp
gulpfile.js
vi gulpfile.js
const webp = require('gulp-webp') gulp.task('webp', function() { return gulp.src("./precompile/img/**/*.{svg,gif,png,jpg,jpeg}") .pipe(webp()) .pipe(gulp.dest("./assets/img/")); });
実行コマンド
gulp webp
流れとしてはprecompile/imgという名前の画像ファイル置き場を作成し、ここにjpgやpngやらの画像を配置する
gulp webpコマンドで上記の画像ファイルをwebpファイルに変換してassets/img以下に配置する
(その後は通常通りnuxt generateでdist以下に画像ファイルが配置される)