Parcel: inline script is empty when minified

Created on 11 Apr 2018 · 18Comments · Source: parcel-bundler/parcel

| Software | Version(s) |
| ---------------- | ---------- |
| Parcel |1.7.0
| Node |v9.11.1
| npm/Yarn |npm 5.8.0
| Operating System |Linux archlinux 4.15.15-1-ARCH #1 SMP PREEMPT Sat Mar 31 23:59:25 UTC 2018 x86_64 GNU/Linux

The inline script inside index.html is empty when building with parcel build index.html, however, the inline script are correctly included when building with parcel build --no-minify index.html.

I have included a simplest example:

index.html

<html lang="en">

<head>
    <script src="./app.js"></script>
</head>

<body>
    <script>
        console.log('hello');
        const p = new Point(10, 10);
    </script>
</body>

</html>

app.js

class Point {
    constructor(x = 1, y = 1) {
        this.x = x;
        this.y = y;
    }

    move(x, y) {
        this.x = x;
        this.y = y;
    }
}

window.Point = Point;

Waiting ✖️ Non-Parcel bug

Source

elgs

All 18 comments

That's weird normally source should be added correctly.
I might look into this when I've got some time

DeMoorJasper on 11 Apr 2018

What's interesting is if I comment out the line const p = new Point(10, 10);, it works correctly with or without --no-minify.

elgs on 11 Apr 2018

Intresting, thanks for the debugging. Now we have a good minimal reproduction script.
Feel free to dig deeper into this

DeMoorJasper on 11 Apr 2018

Thanks. Any chance to take a look at this question. This virtually makes this version of parcel not usable.

elgs on 12 Apr 2018

I think I've found a fix for this, it's a htmlnano issue 100% sure as we don't touch inline js.
You could turn off minification for inline js using the following htmlnano config (.htmlnanorc.js):

module.exports = {
  collapseWhitespace: 'conservative',
  minifyCss: {
    safe: true
  },
  minifyJs: false // This will disable js minification
}

EDIT:
We could ofcourse collect inlined styles and scripts and add them as js dependencies and add them to the bundles?
Or process them ourselves and always disable any inline css or js optiomisation htmlnano does, any ideas about this?

DeMoorJasper on 12 Apr 2018

It seems the problem still exists in 1.7.1.

elgs on 16 Apr 2018

@elgs The fixes in 1.7.1 didn't change the htmlnano config, could you try with the config I proposed?

DeMoorJasper on 16 Apr 2018

Yes I can. But they are some workarounds. I cannot put the inline code in the bundle because the inline code is sample code which doesn’t belong to the bundle. As to editing the config file, the minification should be disabled by default if it doesn’t work.

elgs on 16 Apr 2018

@elgs If the config works than it kinda solved your issue you can do a bug report with htmlnano to fix the minification. If they don't care about it you can always report back and we might pull out the scripts and css from html files and process it through parcel (which eventually will happen anyways, but doesn't seem necessary atm). This isn't a parcel bug and should be resolved inside htmlnano as it seems like a serious htmlnano bug, the config file I provided is just a hotfix for your use-case untill they resolve it.

DeMoorJasper on 16 Apr 2018

@DeMoorJasper thanks I will try. But where is .htmlnanorc.js?

elgs on 17 Apr 2018

@elgs u create it in the root of your project

_{Sent with GitHawk}

DeMoorJasper on 17 Apr 2018

@DeMoorJasper thanks it works for me. Would you please talk a little more about:

minifyCss: {
    safe: true
},

It seems I didn't see the safe option anywhere.

elgs on 17 Apr 2018

@elgs It's a cssnano options that prevents unsafe minification which could lead to unexpected css output.

DeMoorJasper on 17 Apr 2018

It seems I didn't see anywhere talking about the safe option in cssnano's website. Would you mind to share a link about it?

Also I'm wondering whether it is appropriate to close this bug at this moment of time. It's like a car manufacture closes a ticket because the problem is from the part provider before the problem is solved, unless this problem is not considered a problem.

elgs on 17 Apr 2018

@elgs We provided a fix while htmlnano tries to resolve it (unless u didn't file a bug report there), there is not much more we can do. Doesn't seem like it happens that often so including it as standard config, doesn't seem like the obvious choice.

Not sure where cssnano's safe option is defined in their docs, but it describes what it does in the readme. They made it the default behaviour recently as I can see, so it might even be possible that they removed it from the docs, as it's the default now.

DeMoorJasper on 17 Apr 2018

👍1

@DeMoorJasper thanks for the explanation. I haven't filed a bug report to htmlnano. I am too lazy to prepare a use case for their project from scratch. However, I will share this thread with them. I guess this thread should provide enough information for them to address this problem, if they want, of course.

elgs on 17 Apr 2018

👍1

Thanks for submitting the bug! I published new version 0.1.8 with the fix.