gulp-uglify: Uglify throws Parse error

Following this helped:

1. Install Gulp-util
2. Import the Gulp-util by using the following statement: var gutil = require('gulp-util');
3. Finally, when you are uglifying the code, attach the error handler like this: .pipe(uglify().on('error', gutil.log))

I was able to debug it. It was a syntax error in one of the minified files I was including.

In my case (probably others too), this was due to me accidentally writing es6 on an old project that still uses gulp 😅 .

@eqbalsajadi this is exactly the issue you were facing, template literals are not natively supported.

If you wish to use features such as that I’d suggest you use babelify to transform js before uglifying. My fix was to add the babilify transform (https://github.com/babel/babelify)

  var appBundler = browserify({
        entries: [options.src], // Only need initial file, browserify finds the rest
        transform: [
            [reactify, {}], [babelify, { presets: ["es2015", "react"] }],
        ],
        debug: options.development,
        cache: {},
        packageCache: {},
        fullPaths: options.development && !options.hot,
        plugin: options.development && options.hot ? [lrload] : [],
    });

@sunnee5150 you are also running concat before uglify which is providing to be a disadvantage for you in this instance, since now your syntax error is in your concatenated file making it harder to debug (this is also a problem w sourcemaps, since the sourcemap will link to the concat version, but this is another point).

try and run uglify before concatenating and the error message will lead to you to the un-concatenated file and line number, and i think it’ll make it easier for you.

for example:

gulp.src(src.js)
        .pipe(uglify().on('error', gutil.log))
        .pipe(concat(name.js))
        .pipe(gulp.dest(dest.js));

@terinjokes ah thank you, i will look into it!

i figure out that uglify parser do not recognize character (`) that is useful for multiline html inline code https://github.com/terinjokes/gulp-uglify/issues/155

You can use gulp.dest multiple times, so you can save the intermediate “app.min.js” somewhere. In the following example, I save it to the “tmp/dist” folder.

gulp.task('bundle-app', ['templates'], function() {
        return gulp.src(['src/app.js', 'src/**/*.js'])
            .pipe(sourcemaps.init())
                .pipe(concat('app.min.js'))
                .pipe(gulp.dest('./tmp/dist')) // output an intermediate copy of app.min.js
                .pipe(ignore.exclude(['**/*.map']))
                .pipe(uglify().on('error', gulpUtil.log))
            .pipe(sourcemaps.write('./'))
            .pipe(gulp.dest('./public/dist'));
    });