Question

我的 uglify 主 bundle.js 文件存在问题。

这是我的 gulp 脚本：

gulp.task("compile", () => {
    let tsResult = gulp.src("app/**/*.ts")
        .pipe(sourcemaps.init())
        .pipe(tsProject());
    return tsResult.js
        .pipe(sourcemaps.write(".", { sourceRoot: '/app' }))
        .pipe(concat('bundle.js'))
        .pipe(gulp.dest('app/_Dist/'));
});

gulp.task("minify", ["compile"], function () {
    return gulp.src(['app/_Dist/bundle.js'])
        .pipe(concat('bundle.min.js'))
        .pipe(plumber())
        .pipe(uglify())
        .on('error', function (err) { gutil.log(gutil.colors.red('[Error]'), err.toString()); })
        .pipe(plumber.stop())
        .pipe(gulp.dest(outputLocation));
});

运行此脚本后，我会捕获下一个异常：

[15:16:20] [错误] GulpUglifyError：无法缩小JavaScript造成的错误 by：SyntaxError：意外的令牌：punc（:)文件： C：\ Projects \ AngGulpApp \ app \ _Dist \ bundle.min.js行：1

tsconfig.json

{
    "compileOnSave": true,
    "compilerOptions": {
        "target": "es5",
        "module": "es2015",
        "moduleResolution": "node",
        "noEmitOnError": false,
        "sourceMap": true,
        "emitDecoratorMetadata": true,
        "experimentalDecorators": true,
        "removeComments": false,
        "noImplicitAny": false,
        "lib": [ "es2015", "dom" ],
        "baseUrl": ".",
        "typeRoots": [
            "node_modules/@types"
        ]
    },
    "exclude": [
        "gulpfile.ts",
        "node_modules"
    ]
}

我不知道如何解决这个问题。有任何想法如何解决这个问题？

Answer 1

我找到了解决此问题的方法。基本上 uglify 不适用于 ES6 （目前仅使用 ES5 ）。要解决此问题，我们需要使用TypeScript帮助 Transpilation 结果 ES5 ，然后运行缩小。

例如：

var ts = require('gulp-typescript');
var uglify = require('gulp-uglifyjs');
....
.pipe(ts({
    target: "es5",
    allowJs: true,
    module: "commonjs",
    moduleResolution: "node"
}))
.pipe(uglify())

这部分代码将我当前的捆绑代码转换为ES5，然后运行 uglify（）函数进行缩小。

GulpUglifyError：无法缩小JavaScript（Angular 4）

1 个答案: