web-dev-qa-db-fra.com

Comment résoudre cette erreur de minification sur Gulp?

Je reçois une erreur en cours d'exécution de cette commande

gulp.task('minify', function () {
    return gulp
      .src('public/app/js/myapp.bundle.js')
      .pipe(uglify())
      .pipe(gulp.dest('public/app/js/myapp.bundle.min.js'));
});

GulpUglifyError: impossible de minimiser JavaScript Causé par: SyntaxError: Jeton inattendu: nom (MenuItem) (ligne: 1628, col: 18, pos: 53569)

Le code à cet endroit est le suivant

 setters: [],
 execute: function () {
     class MenuItem {  // <-- line 1628

Qu'est-ce qui ne va pas?

23
StackOverflower

UglifyJS ne prend pas en charge actuellement Structures EcmaScript 6 comme les classes .

Vous devrez probablement exécuter votre JavaScript à travers une étape de transpilateur, ou trouver un minifieur qui sait quoi faire avec le code ES6.

Mise à jour 2017-06-17

La branche d'UglifyJS conçue pour fonctionner avec ES6 est désormais publiée sous la forme uglify-es à npm.

Mise à jour 2018-09-10

terser est le nouveau uglify-es, uglify-es n'est plus mainten .

Si vous utilisez gulp les deux npmjs gulp-uglify-es et npmjs gulp-terser packages supportent le terser.

npm install gulp-terser --save-dev
const gulp = require('gulp');
const terser = require('gulp-terser');

function es(){
  return gulp.src('./src/index.js')
    .pipe(terser())
    .pipe(gulp.dest('./build'))
}

gulp.task('default', es);
46
StriplingWarrior

Si vous rencontrez ce problème et que vous avez en fait une étape de transcription comme Babel, assurez-vous que vous incluez le bon préréglage Babel en vous .babelrc fichier. Sinon, Babel laissera simplement votre code tel quel.

Par exemple.

{
  "presets": ["es2015"]
}
4
Adam Reis