Gulp uglify无法处理箭头功能 [英] Gulp uglify unable to handle arrow functions

问题描述

我正在使用 gulp-uglify 压缩我的项目，但是gulp似乎抛出错误意外的令牌：punc（）每当遇到代码中的箭头函数。有什么可以做的来解决这个问题吗？谢谢。

I'm trying to compress my project using gulp-uglify, however gulp seems to throw the error Unexpected token: punc () whenever it encounters an arrow function in the code. Is there anything I can do to fix this? Thank you.

// Function with callback to simulate the real code
function test(callback) {
    if (typeof callback === "function") callback();
}

// Causes a crash
test(() => {
    console.log("Test ran successfully!");
});

// Doesn't cause a crash
test(function () {
    console.log("Test ran successfully!");
});

gulpfile.js

gulpfile.js

var gulp = require("gulp");
var concat = require("gulp-concat");
var uglify = require("gulp-uglify");

gulp.task("scripts", function() {
    gulp.src([
        "./gulp-crash-test.js"
    ]).pipe(
        concat("gulp-crash-test.min.js")
    ).pipe(
        uglify().on('error', function(e){
            console.log(e);
        })
    ).pipe(
        gulp.dest("./")
    );
});

gulp.task("watch", function() {
    gulp.watch("./gulp-crash-test.js", ["scripts"]);
});

gulp.task("default", ["watch", "scripts"]);

推荐答案

箭头功能是一个ES6功能。 Babel（和其他）旨在将ES6转换为ES5或更早版本，作为构建过程的一部分。幸运的是，有Gulp和Grunt的Babel插件。在uglify之前运行Babel。

Arrow functions are an ES6 feature. Babel (and others) are designed to translate ES6 to ES5 or earlier as part of your build process. Luckily there are Babel plug-ins for Gulp and Grunt. Run Babel before uglify.

https：//www.npmjs。 com / package / gulp-babel

我希望这可以引导你走向正确的方向/有人可以演示一些代码。

I hope this steers you in the right direction/somebody can demonstrate some code.

这篇关于Gulp uglify无法处理箭头功能的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！