UglifyJs error on production build

sage
1

When building a production build I get this error:

scripts/main_0282ea08.js from UglifyJs
Unexpected token: operator (>) [scripts/main_0282ea08.js:471,43]

The issue comes from this import:

import Swiper from 'swiper';

This issue seems to be related to

But no jsx files are currently used and the proposed fixes either don’t work (!babel) or don’t apply (comment out exclude for jsx).

I cannot find a babel-specific webpack loader, instead I found buble which seems to be a lightweight replacement for ES-style imports. Uglifyjs is installed (2.x) and some report that updating it to v3.x resolves the issue. For this I need to know first, what exactly is using uglifyjs during the webpack build.

2

I was able to resolve this issue by commenting out
//exclude: [/node_modules(?![/|\\](bootstrap|foundation-sites))/],
in resources/assets/build/webpack.config.js as recommended in some GitHub discussions (https://github.com/JeffreyWay/laravel-mix/issues/790#issuecomment-371511832).

3

Another workaround is also to import it like this:

import Swiper from ‘swiper/dist/js/swiper’;

1 Like
4

I ran into some UglifyJS errors as well while using for .. of loop.

I think it would be better to add UglifyJSPlugin because right now we’re using webpack’s built-in old version 0.4.6.

"build:production" script has a -p flag which is a shortcut for --optimize-minimize --define process.env.NODE_ENV="production". Docs: https://webpack.js.org/api/cli/#shortcuts

-optimize-minimize is responsible for running the UglifyJSPlugin behind the scenes.

Solution would be to install UglifyJSPlugin, configure it inside webpack.config.optimize and replace -p flag with --env.production. This way we’ll have control over UglifyJS settings.

3 Likes
5

Would it make sense to add this directly to sage repository (PR)?

6

Yea, will do once I find a bit more time.

7

Actual Repo with UglifyJs stucks on 91% in my case. Maybe i’m not alone with this.
I work on an project in development, so i merge the master regulary. Maybe it’s just a bug in my code i don’t see.

8

Cross linking for convenience. Here is the pull request that adds the Uglify plugin to the Webpack optimize config
https://github.com/roots/sage/pull/2070

3 Likes