web-dev-qa-db-fra.com

Grunt-contrib-uglify n'analyse-t-il pas les mots clés "let"?

Je reçois une erreur, 

"Jeton inattendu: nom (bazz)"

quand ma tâche de grognement s'exécute. La seule chose que j'ai remarquée sur cette ligne, c'est que j'utilisais le mot clé 'let' au lieu de 'var', je ne savais donc pas pourquoi cette erreur était générée.

J'ai une instruction if else avec let nomVar dans chacune, c'est-à-dire:

function foo (bar) {
    if (condition) {
        let bazz = fn();
        //doSomething with bazz
        _.assign(bar, bazz);
    } else {
        let bazz = fn2();
        //doSomething different with bazz
        _.assign(bar, bazz);
    }
}

Je pourrais le modifier en ayant un var bazz = {}; avant la clause if else, mais je voulais éviter cela car je devrais assigner bazz à fn () et à fn2 () de toute façon.

Je voulais savoir si quelqu'un d'autre s'était heurté à cela et ce qu'ils avaient fait pour le réparer. Merci d'avance!

javascriptuglifyjsgrunt-contrib-uglify
23
Michael M

Après des recherches un peu plus approfondies sur ce sujet, j'ai découvert que grunt-contrib-uglify et gulp-uglify ont UglifyJS en tant que dépendance et qu'il ne prend pas encore en charge ES6 "Harmony". Suivez https://github.com/mishoo/UglifyJS2/issues/448 pour les mises à jour.

Vous pouvez également utiliser des outils tels que grunt-babel pour compiler votre code ES6 en ES5.

18
Aaaron

Je suis tombé sur ce qui suit sur la page officielle gulp-uglify npm. 

Notez la recommandation:

Pour aider à gérer correctement les conditions d'erreur avec les flux de nœuds, ceci Le projet recommande l’utilisation de pump . Pour plus d'informations, voir Pourquoi utiliser Pompe? .

Mon implémentation de l'exemple sur la page ci-dessus est: 

gulpfile.js

var gulp = require('gulp');  
var pump = require('pump');  

// the npm page states:  
// can be a git checkout or another module 
// (such as `uglify-js-harmony` for ES6 support)
var uglifyjs = require('uglify-js-harmony');   
var minifier = require('gulp-uglify/minifier');  

var concat = require('gulp-concat');

gulp.task('compress', function (cb) {  
  // the 'options' argument is included in the example, 
  // but i don't know what it does or how it can be removed  
  var options = {  
    preserveComments: 'license'  
  };  

  pump([  
      gulp.src('my_scripts/*.js'),  // gets all js scripts in this folder  
      minifier(options, uglifyjs),  
      concat('my_bundled_script.js'), // concatenates all scripts into this file  
      gulp.dest('dist')  // puts the file into this folder
    ],cb 
  );  
});

package.json

{
  "devDependencies": {
    "gulp": "latest",
    "pump": "latest",
    "gulp-concat": "latest",
    "gulp-uglify": "latest",
    "uglify-js-harmony": "latest"
  },
  "dependencies": {}
}

Résultats

Sans utiliser uglify-js-harmony:

  • pump a été utile pour localiser l'origine de l'erreur (lors de l'utilisation de gulp-uglify) 
  • un fichier qui avait une instruction let a causé des erreurs 

Lors de l'utilisation de uglify-js-harmony, les erreurs ne se sont pas produites. 

Autres considérations:

La page ci-dessus montre actuellement:

// can be a git checkout or another module  
// (such as `uglify-js-harmony` for ES6 support)
var uglifyjs = require('uglify-js');

Mais lors de l'installation de uglify-js-harmony j'ai reçu le message d'avertissement:

npm WARN obsolète [email protected]: obsolète en faveur de uglify-es

Cependant, lorsque j'ai essayé d'utiliser uglify-es au lieu de uglify-js-harmony, j'ai reçu un message d'erreur semblable à celui décrit ici:

https://github.com/terinjokes/gulp-uglify/issues/287

J'ai essayé de suivre le fil conducteur à partir de là, mais je me suis égaré et je ne parvenais pas à trouver une solution définitive quant à la mise en œuvre de uglify-es. 

0
user1063287