Grunt-terser failing to minify React JSX code on Sails

Viewed 35

I am using browserify with babelify to transpile React code from ES6 and everything went smoothly until trying to minify using Uglify and discovered that Uglify doesn't do ES6 syntax, so I switched to terser through grunt-terser but I cannot seem to find the appropriate options needed to minify React code and so I get the error "Unexpected token operator (<)" on basic React syntax when trying to use ReactDOM.render inside of my bundled javascript file.

The only other solutions I am seeing around the web is to switch from grunt to webpack but I don't want to make such a change and it not work, is there any way to make this work with terser and/or grunt?

module.exports = function(grunt) {
grunt.config.set('terser', {
    dist: {
        src: ['.tmp/public/concat/production.js'],
        dest: '.tmp/public/js/app.js'
      },
      options: {
        ecma: 6,
        parse: {
          ecma: 6,
          module: true,
          toplevel: true,
        },
        mangle: {
          module: true,
          keep_fnames: false,
          toplevel: true
        },
        compress: {
          unsafe_comps: true
        }
      }
});

grunt.loadNpmTasks('grunt-terser');

};

I have tried several different options to try and minify and all give the same error.

0 Answers
Related