Uglification failed. Unexpected character '`'

sailens picture sailens · Dec 21, 2015 · Viewed 14.1k times · Source

gulp-uglify is unable to uglify this piece of code:

    var alertString = `<?xml version="1.0" encoding="UTF-8" ?>
        <document>
          <alertTemplate>
            <title>${title}</title>
            <description>${description}</description>
          </alertTemplate>
        </document>`

it complains at the character: `. The character is valid for the apple's JS framework. I can't see anything inside the uglify package to ignore those characters and the text string inside it. Am i missing something from the documentation?

Answer

sailens picture sailens · Dec 22, 2015

Gulp-uglify has yet no official support for ECMAScript 2015 (aka ES6, aka Harmony) but with a little modification the on-development repository can be used.

How-to:

  1. Open Console and enter

cd node_modules/gulp-uglify

  1. Edit package.json

dependencies": { "uglify-js": "git+https://github.com/mishoo/UglifyJS2.git#harmony" },

  1. Console enter:

npm update

And it is ready to run .pipe(uglify()) again


Alternate Solution

  1. Download the following via npm:

npm install --save-dev gulp-uglify gulp-babel babel-preset-es2015

  1. Add the following requires in the gulpfile.js:

var babel = require('gulp-babel'), uglify = require('gulp-uglify');

  1. The gulp task will be as follow:

gulp.task('uglify', function(){ gulp.src('*.js') .pipe(babel({ presets: ['es2015'] })) .pipe(uglify().on('error', function(e){ console.log(e); })) .pipe(gulp.dest('js')); });

What this does is transpile all the EcmaScript 2015 JS code to EcmaScript5 and then uglifies it.