我正在尝试使用gulp-imagemin，但是每次都会出现错误。 我已经将这个post涂成红色，但不能解决问题。 我不知道为什么...有人可以帮助我吗？
这是我尝试运行gulp-imagemin时得到的：
toni@MacBook-Pro-de-Toni mysite % gulp images
[15:04:15] Using gulpfile /Applications/MAMP/htdocs/mysite/wp-content/themes/mysite/gulpfile.js
[15:04:15] Starting 'images'...
[15:04:15] gulp-imagemin: Couldn't load default plugin "gifsicle"
[15:04:15] gulp-imagemin: Couldn't load default plugin "optipng"
[15:04:15] gulp-imagemin: Minified 0 images
[15:04:15] Finished 'images' after 190 ms
这是我的package.json：
{
"name": "mysite-child",
"version": "1.0.0",
"description": "Gulp for mysite-child",
"main": "gulpfile.js",
"scripts": {
"test": "echo \"Error: no test specified\" && exit 1"
},
"author": "",
"license": "ISC",
"devDependencies": {
"browser-sync": "^2.26.7",
"gulp": "^4.0.2",
"gulp-autoprefixer": "^7.0.1",
"gulp-clean-css": "^4.2.0",
"gulp-concat": "^2.6.1",
"gulp-imagemin": "^6.2.0",
"gulp-sass": "^4.0.2",
"gulp-uglify": "^3.0.2",
"gulp-watch": "^5.0.1"
}
}
和gulpile.js
/* Gulp vers.4 */
const gulp = require('gulp');
const sass = require('gulp-sass');
const autoprefixer = require('gulp-autoprefixer');
const browserSync = require('browser-sync').create();
const concat = require('gulp-concat');
const cleanCss = require('gulp-clean-css');
const uglify = require('gulp-uglify');
const imagemin = require('gulp-imagemin');
// compile scss into css
function style() {
// 1. where are my sccs files
return gulp.src('sources/styles/*.*')
// 2. pass that file through sass compiler (gulp-sass)
.pipe(sass().on('error', sass.logError))
// 3. add CSS prefix with Autoprefixer
.pipe(autoprefixer())
// 4. concat all the scss files into 1 (gulp-concat)
.pipe(concat('style.css'))
// 5. minify this file (gulp-clean-css)
.pipe(cleanCss())
// 6. where do I save the compiled CSS?
.pipe(gulp.dest('./'))
// 7. stream changes to ALL browsers (browser-sync)
.pipe(browserSync.stream());
}
function js() {
// 1. where are my js files
return gulp.src('sources/js/*.*')
// 2. concat all the js files into 1 (gulp-concat)
.pipe(concat('javascript.js'))
// 3. minify this file (gulp-uglify)
.pipe(uglify().on('error', function(e){console.log(e);}))
// 4. where do I save the compiled JS?
.pipe(gulp.dest('./'))
}
// Optimize Images
function images() {
return gulp
.src("sources/img/**/*")
.pipe(imagemin())
.pipe(gulp.dest("./img"));
}
function watch() {
browserSync.init({
proxy: "localhost:8888/mysite/",
notify: true
});
gulp.watch('sources/styles/*.*', style);
gulp.watch('./*.php').on('change', browserSync.reload);
gulp.watch('sources/js/*.*', js).on('change', browserSync.reload);
gulp.watch("sources/img/**/*", images);
}
exports.style = style;
exports.js = js;
exports.images = images;
exports.watch = watch; //para lanzar este plugin escribir en la Terminal "gulp watch" (dentro de la carpeta del proyecto)
我安装了gulp-imagemin很多次，每次都注意到此错误：
toni@MacBook-Pro-de-Toni mysite-child % npm install -D gulp-imagemin
> gifsicle@4.0.1 postinstall /Applications/MAMP/htdocs/mysite/wp-content/themes/mysite-child/node_modules/gifsicle
> node lib/install.js
⚠ connect ECONNREFUSED 127.0.0.1:443
⚠ gifsicle pre-build test failed
ℹ compiling from source
✖ Error: Command failed: /bin/sh -c autoreconf -ivf
/bin/sh: autoreconf: command not found
at Promise.all.then.arr (/Applications/MAMP/htdocs/mysite/wp-content/themes/mysite-child/node_modules/execa/index.js:231:11)
at <anonymous>
at process._tickCallback (internal/process/next_tick.js:188:7)
> jpegtran-bin@4.0.0 postinstall /Applications/MAMP/htdocs/mysite/wp-content/themes/mysite-child/node_modules/jpegtran-bin
> node lib/install.js
⚠ connect ECONNREFUSED 127.0.0.1:443
⚠ jpegtran pre-build test failed
ℹ compiling from source
✖ Error: Command failed: /bin/sh -c ./configure --disable-shared --prefix="/Applications/MAMP/htdocs/mysite/wp-content/themes/mysite-child/node_modules/jpegtran-bin/vendor" --bindir="/Applications/MAMP/htdocs/mysite/wp-content/themes/mysite-child/node_modules/jpegtran-bin/vendor"
configure: error: in `/private/var/folders/70/p2_v75w13jz6fgvwdqrqmpwr0000gn/T/eb7b4ee6-ee35-49ec-bd42-4291506c2403':
configure: error: C compiler cannot create executables
See `config.log' for more details
checking for a BSD-compatible install... /usr/bin/install -c
checking whether build environment is sane... yes
checking for a thread-safe mkdir -p... ./install-sh -c -d
checking for gawk... no
checking for mawk... no
checking for nawk... no
checking for awk... awk
checking whether make sets $(MAKE)... no
checking whether make supports nested variables... no
checking whether make supports nested variables... (cached) no
checking for style of include used by make... none
checking for gcc... gcc
checking whether the C compiler works... no
at Promise.all.then.arr (/Applications/MAMP/htdocs/mysite/wp-content/themes/mysite-child/node_modules/execa/index.js:231:11)
at <anonymous>
at process._tickCallback (internal/process/next_tick.js:188:7)
> optipng-bin@6.0.0 postinstall /Applications/MAMP/htdocs/mysite/wp-content/themes/mysite-child/node_modules/optipng-bin
> node lib/install.js
⚠ connect ECONNREFUSED 127.0.0.1:443
⚠ optipng pre-build test failed
ℹ compiling from source
✖ Error: Command failed: /bin/sh -c ./configure --with-system-zlib --prefix="/Applications/MAMP/htdocs/mysite/wp-content/themes/mysite-child/node_modules/optipng-bin/vendor" --bindir="/Applications/MAMP/htdocs/mysite/wp-content/themes/mysite-child/node_modules/optipng-bin/vendor"
Checking for gcc...
Using pre-configured libpng...
Checking for system zlib...
./configure: error: missing zlib or incorrect zlib version
./configure: note: zlib version 1.2.1 or higher is required
at Promise.all.then.arr (/Applications/MAMP/htdocs/mysite/wp-content/themes/mysite-child/node_modules/execa/index.js:231:11)
at <anonymous>
at process._tickCallback (internal/process/next_tick.js:188:7)
npm WARN mysite-child@1.0.0 No repository field.
npm WARN optional SKIPPING OPTIONAL DEPENDENCY: gifsicle@4.0.1 (node_modules/gifsicle):
npm WARN optional SKIPPING OPTIONAL DEPENDENCY: gifsicle@4.0.1 postinstall: `node lib/install.js`
npm WARN optional SKIPPING OPTIONAL DEPENDENCY: Exit status 1
npm WARN optional SKIPPING OPTIONAL DEPENDENCY: optipng-bin@6.0.0 (node_modules/optipng-bin):
npm WARN optional SKIPPING OPTIONAL DEPENDENCY: optipng-bin@6.0.0 postinstall: `node lib/install.js`
npm WARN optional SKIPPING OPTIONAL DEPENDENCY: Exit status 1
+ gulp-imagemin@6.2.0
added 232 packages in 34.103s