question-mark
Stuck on an issue?

Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.

And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.

Support for ES6 minification

See original GitHub issue

Hi

the html-webpack-plugin is making heavy use of html-minifier to keep the html compact.

Now that many browsers support ES6 out of the box, people start using ES6 inside script tags.
According to @evilebottnawi from the webpack team using ES6 is not possible because html-minifier is not capable of parsing ES6: https://github.com/jantimon/html-webpack-plugin/issues/1262

When webpack was faced with the same problem they made a switch to terser which has now about 6 million downloads per week.

uglify-es is no longer maintained and uglify-js does not support ES6+.

terser is a fork of uglify-es that mostly retains API and CLI compatibility with uglify-es and uglify-js@3.

(taken from their official readme)

There was already a proposal to do the same change for the html-minifier: #1034

It would mean to replace https://github.com/kangax/html-minifier/blob/51ce10f4daedb1de483ffbcccecc41be1c873da2/package.json#L63 with terser

Issue Analytics

  • State:open
  • Created 4 years ago
  • Reactions:12
  • Comments:19 (3 by maintainers)

github_iconTop GitHub Comments

9reactions
willfarrellcommented, Sep 26, 2019

Workaround:

const jsMinify = require('terser').minify;
const htmlMinify = require('html-minifier').minify;
const htmlMinifyOptions = {
  ...
  minifyJS: (text, inline) => {
        const res = jsMinify(text, { warnings: true })
        if (res.warnings) console.log(res.warnings)
        if (res.error) {
            console.log(text)
            throw res.error
        }
        return res.code
    }
...
}
...
output = htmlMinify(output, htmlMinifyOptions)
8reactions
DanielRufcommented, Nov 2, 2019

html-minifier-terser v5.0.0 is released now: https://www.npmjs.com/package/html-minifier-terser

Read more comments on GitHub >

github_iconTop Results From Across the Web

es6-minify - npm search
Language aware code comparison tool for several web based languages. It also beautifies, minifies, and a few other things.
Read more >
Minification Issues When Using ES6 in Your Custom Code
This article documents a minification error you will encounter if using ECMAScript 6 (ES6) in your custom code and the ES6 code is...
Read more >
javascript minify library with support to ES6 classes with ...
I'm looking for a library able to minify ES6 modules implementing clases with private members. All I have tried so far, including Google ......
Read more >
JavaScript Minify Tool - DigitalOcean
Minifying, or minification, is where you remove unnecessary characters from your code, whether they might be whitespace (such as indentation), code that isn't ......
Read more >
using es6 function not working after the minify
Hello guys, I have an issue regarding using ES6 functions which is after minifying the JS, it seems it doesn't support it. Any...
Read more >

github_iconTop Related Medium Post

No results found

github_iconTop Related StackOverflow Question

No results found

github_iconTroubleshoot Live Code

Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start Free

github_iconTop Related Reddit Thread

No results found

github_iconTop Related Hackernoon Post

No results found

github_iconTop Related Tweet

No results found

github_iconTop Related Dev.to Post

No results found

github_iconTop Related Hashnode Post

No results found