ember-cli-imagemin lossyPNG ImageMin.pngquant n'est pas une fonction

Question

J'essaie d'activer la propriété lossyPNG dans l'addon ember-cli-imagmin pour créer une petite taille de fichier pour mes .pngs. Mon EmberApp de Braise-cli-build.js comprend imagemin comme ceci:

imagemin: { 
    interlaced: true, 
    optimizationLevel: 3, 
    progressive: true, 
    lossyPNG: true, 
    pngquant: { 
    speed: 1, 
    quality: 80 
    } 
} 

Les dépendances objet dans mon package.json comprend:

{ ... 
    "ember-cli-imagemin": "0.4.0", 
    "imagemin": "3.2.2", 
    "imagemin-pngquant": "4.2.2", 
    ... 
} 

Cependant, chaque fois que je lance la construction de Ember je reçois le texte suivant erreur:

The Broccoli Plugin: [object Object] failed with: 
TypeError: ImageMin.pngquant is not a function 

Cette erreur me pointe à line in broccoli-imagemin. Si je mets lossyPNG à false dans ember-cli-build.js alors je ne reçois aucune erreur, mais mes pngs pourraient être optimisés en fonction des résultats de pagespeed. Qu'est-ce qui me manque pour pouvoir utiliser pngquant pour optimiser mes images png?

Answer 1

broccoli-imagemin, dont dépend ember-cli-imagemin, est le problème. Comme il n'a pas été mis à jour depuis novembre 2014, il utilise une ancienne version de imagemin, mais le package.json specification permet imagemin v3.x. pngquant était removed as a default property dans imagemin v3.2.0. Donc, si vous forcez l'installation de imagemin v3.1.0 dans votre package.json, cela devrait fonctionner.

Si vous souhaitez utiliser une version plus récente de imagemin, regardez this PR. J'essaierais d'utiliser that branch directement. You can install that branch directly from the repo avec:

ember install https://github.com/kanongil/ember-cli-imagemin.git#v5-imagemin 

Ce changement de branche comment fonctionne imagemin. Au lieu de passer des options, il semble que vous passiez juste les plugins que vous voulez utiliser, et leur passiez directement leurs options.

var app = new EmberApp({ 
    imagemin: { 
    plugins: [ 
     require('imagemin-jpegtran')({ progressive: true }), 
     require('imagemin-pngquant')({speed: 1, quality: 80}), 
     require('imagemin-svgo')() 
    ] 
    } 
});