Since 4.13.0: prod mode with Lasso->minify is not working anymore

[akaufmann]

Marko Version: 4.13.0

Details

Since the upgrade to v4.13.0 Lasso has caused an error with minifying enabled. UglifyJS does not understand the getters in one of Marko's files.

This is our Lasso configuration:

if (isProduction) {
  transforms = [{ transform: 'lasso-babel-transform' }]
}

require('lasso').configure({
  plugins: [
    'lasso-marko',
  ],
  outputDir: `${__dirname}/static`,
  bundlingEnabled: isProduction,
  minify: isProduction,
  fingerprintsEnabled: isProduction,
  require: { transforms },
})

// .babelrc
{
  "presets": ["env"],
  "plugins": ["transform-object-assign"],
  "retainLines": true
}

Expected Behavior

Everything works like with v4.12.5

Actual Behavior

/<path/to/the/project>/node_modules/lasso/src/plugins/lasso-minify-js/index.js:57
                    throw e;
                    ^

TypeError: Cannot read property 'length' of undefined
    at Object.transform (/<path/to/the/project>/node_modules/lasso/src/plugins/lasso-minify-js/index.js:44:30)
    at applyTransform (/<path/to/the/project>/node_modules/lasso/src/transforms.js:62:30)

Error msg from UglifyJS:

{ error: 
   { SyntaxError: Unexpected token: name (firstChild)
    at JS_Parse_Error.get (eval at <anonymous> (/<path/to/the/project>/node_modules/uglify-js/tools/node.js:20:1), <anonymous>:71:23)
    at formatError (util.js:610:16)
    at formatValue (util.js:514:18)
    at formatProperty (util.js:801:11)
    at formatObject (util.js:617:17)
    at formatValue (util.js:579:18)
    at inspect (util.js:294:10)
    at format (util.js:161:12)
    at Console.log (console.js:130:21)
    at Object.transform (/<path/to/the/project>/node_modules/lasso/src/plugins/lasso-minify-js/index.js:49:29)
     message: 'Unexpected token: name (firstChild)',
     filename: '0',
     line: 7,
     col: 12,
     pos: 299 } }

That's the code that's causing the problem:

$_mod.def("/marko$4.13.0/dist/morphdom/fragment", function(require, exports, module, __filename, __dirname) {
            var helpers = require(\'/marko$4.13.0/dist/morphdom/helpers\'/*"./helpers"*/);
            var insertBefore = helpers.ap_;\ n\ nvar fragmentPrototype = {
                    nodeType: 12,
                    get firstChild() {
                        let firstChild = this.startNode.nextSibling;
                        return firstChild === this.endNode ? undefined : firstChild;
                    },
                    get lastChild() {
                       ...
                    }

Possible Fix

a) Remove the getter, b) minify with a tool that understands ES6 or c) ...

Your Environment

• macOS Sierra

[akaufmann]

🎉 Thanks guys for the quick fix 🎉

[DylanPiercey]

No problem. We need a better solution to prevent this from happening in the future 😟.

Thanks for notifying us right away, helps a lot 😄.