[Résolu] Gulp4 - Optimisation Image - ImageMagick - Windows10

Flo418
Javascript NodeJS

Bonjour,

J'ai essayé de suivre la vidéo sur Gulp4 Les nouveautés.
Le soucis c'est que je suis sur Windows10 et je n'arrive pas à adapter.
J'utilise laragon pour avoir NodeJS (v10.14.2).

Ce que je fais

J'ai d'abord eu un problème lié au fait que je n'avais pas ImageMagick.
Après avoir paramétrer la variable PATH de Windows pour lui indiquer l'emplacement ImageMagick, j'ai testé son fonctionnement en convertissant une image .png en .jpg

magick convert mon_image.png mon_image.jpg

Cela à bien fonctionné.

Lorsque j'éxécute la commande suivante:

magick convert -help

Elle me retourne bien un résulat:

Version: ImageMagick 7.0.8-44 Q16 x64 2019-05-04 http://www.imagemagick.org
Copyright: Copyright (C) 1999-2018 ImageMagick Studio LLC
License: http://www.imagemagick.org/script/license.php
Visual C++: 180040629
[...]

ImageMagick fonctionne donc en ligne de commande.
Mais il semble que Gulp ne parvienne pas à fonctionner correctement dans cet environnnement.

Voici mon problème

J'aimerai avoir des indices, votre aide pour essayer de faire fonctionner ce code sur ma machine:

gulpfile.js

const {src, dest} = require('gulp')
const resizer = require('gulp-image-resize')

// path
var source = "images/*.jpg"; 
var destination = 'dist/images'; // dossier à livrer

function images(){
    return src(source)
        .pipe(resizer({
            width: 100,
            height: 100,
            crop: true,
            imageMagick: true
        }))
        .pipe(dest(destination))
}

module.exports = {
    images
}

Lorsque j'execute la commande:

C:\chemin_vers_node_js\laragon\bin\nodejs\node-v10.14.2-win-x64\npx.cmd gulp images

J'obtien l'érreur suivante:

[14:39:32] Using gulpfile C:\chemin_vers_node_js\laragon\www\test_sass\gulpfile.js
[14:39:32] Starting 'images'...
[14:39:32] 'images' errored after 120 ms
[14:39:32] Error in plugin "gulp-gm"
Message:
Stream yields empty buffer
Details:
domainEmitter: [object Object]
domain: [object Object]
domainThrown: false

Lorsque je modifie la source en passant de :

var source = "images/*.jpg";

A

var source = "images";

Je n'ai pas d'erreur, le script créer bien un dossier "dist\images" vide.
Ce qui semble normal puisqu'il n'y a pas d'images depuis la source indiquée, cela permet de savoir qu'il n'y a pas d'erreur de script ?

J'ai essayé en indiquant en source une image directement "var source = "images/Image 1.jpg"; " mais j'ai la même erreur qu'avec "var source = "images/*.jpg"; ".

Gulp ne parvient pas à utiliser la version ImageMagick de Windows?
Sur cette page il est indiqué que pour vérifier le bon fonctionnement ImageMagick, il faut executer la commande suivante:

convert -help

Pour ma part je dois exécuter la commande:

Magick convert -help

Est-ce que le problème vient de là?

Merci pour votre aide.

======================

j'ai finalement trouvé une solution.
Je n'utilise pas imageMagick mais graphicsmagick d'après la page sur gulp-gm cela fonctionne mieux avec GraphicsMagick. Dans mon cas oui, après je ne sais pas exactement la différences entre les deux.

Aucune réponse