UglifyJs: Unexpected token: operator (>) #790

tillkruss · 2017-05-08T14:58:19Z

When running npm run production I get the following error:

/js/listing.js from UglifyJs
Unexpected token: operator (>) [./~/bootstrap/js/src/dropdown.js:11,0][/js/listing.js:3302,23]

I've tried deleting node_modules without any luck, same goes for installing:

yarn add --dev git+https://github.com/mishoo/UglifyJS2.git#harmony

Arrow function seem to be the issue, line 11 of dropdown.js is:

const Dropdown = (($) => {

I don't have a .babelrc file.

laravel-mix@0.11.4
Node: v7.9.0
NPM: 4.5.0
macOS: 10.12.4

The text was updated successfully, but these errors were encountered:

hernandev · 2017-05-08T23:57:08Z

@tillkruss take a look at the exactly installed version of mix, i ran into this issue a couple of days ago and it was solved by both mix upgrade and #harmony branch of uglify.js

tillkruss · 2017-05-09T00:32:10Z

Shouldn't uglify work out of the box, since it's enabled by default in production?

Shchepotin · 2017-05-09T22:52:36Z

Same problem.

suhaibmalik · 2017-05-13T00:53:32Z

@hernandev I used to have it working about a month ago too using the harmony branch. However, they've since moved it to uglify-es and now I can't get it to work, again. What exactly do you have setup at the moment?

robbyrice · 2017-05-13T22:22:49Z

Running into this same problem and not having any luck fixing it. I've tried installing the harmony branch of uglifyjs and adding a .babelrc file with the es2015 preset, but nothing has worked.

TheYorickable · 2017-05-14T18:25:04Z

Same problem, adding .babelrc triggers new error.

bbashy · 2017-05-19T09:49:39Z

Getting the same when using a package that has => {}. Seems like UglifyJs is working on it mishoo/UglifyJS#448

JeffreyWay · 2017-05-23T15:38:02Z

I'm about to tag a new release that bumps the Uglify version, so I think that should fix this.

tillkruss · 2017-05-24T16:10:09Z

@JeffreyWay: Still the same error using 0.12.0.

ipa1981 · 2017-05-30T14:30:58Z

@JeffreyWay still the same using 0.12.1

/js/app.js from UglifyJs
Unexpected token: operator (>) [./~/vue-strap/src/utils/utils.js:4,0][/js/app.js:28290,16]

tillkruss · 2017-05-30T14:32:44Z

@JeffreyWay: Could you re-open this until it's resolved?

balthild · 2017-06-24T02:24:36Z

Any updates?

iraklisg · 2017-06-27T07:32:01Z

@balthild, all upgrading to laravel-mix@1.0.7 solved the problem for me

ipa1981 · 2017-06-27T09:00:35Z

@iraklisg Nope. upgraded to 1.0.7, still the same:

 ERROR  Failed to compile with 1 errors                              11:59:05 AM

 error  

/js/app.js from UglifyJs
Unexpected token: operator (>) [./node_modules/vue-strap/src/utils/utils.js:4,0][/js/app.js:28274,16]

ruchernchong · 2017-06-27T09:59:36Z

@ipa1981 rm -rf node_modules directory, rm package-lock.json and npm install. See if that works.

When upgrading from 0.* to 1.* I had to do that to make things work.

Also, check if your npm is now 5.0.4. 5.0.3 had problems with some packages/dependencies not being installed.

ipa1981 · 2017-06-27T10:00:55Z

@ruchern I use yarn . no package-lock here.

ruchernchong · 2017-06-27T10:03:54Z

@ipa1981 Oh then your result may vary from mine. Well, you can still try to clear out the old packages and do a reinstall. Let me know if that worked.

ipa1981 · 2017-06-27T10:06:16Z

@ruchern Just did it. Same problem:

$ rm -rf node_modules
$ rm yarn.lock
$ yarn install
yarn install v0.24.6
info No lockfile found.
[1/4] Resolving packages...
warning datatables.net-buttons-bs > datatables.net-bs@2.1.1: Incorrect version published. Please use the latest non-deprecated version - 1.10.13 at the time of writing
[2/4] Fetching packages...
warning fsevents@1.1.2: The platform "linux" is incompatible with this module.
info "fsevents@1.1.2" is an optional dependency and failed compatibility check. Excluding it from installation.
[3/4] Linking dependencies...
warning "less-loader@4.0.4" has incorrect peer dependency "webpack@^2.2.0".
warning "webpack-dev-server@2.5.0" has incorrect peer dependency "webpack@^2.2.0".
warning "extract-text-webpack-plugin@2.1.2" has incorrect peer dependency "webpack@^2.2.0".
[4/4] Building fresh packages...
success Saved lockfile.
Done in 43.75s.
$ yarn run production
yarn run v0.24.6
$ cross-env NODE_ENV=production node_modules/webpack/bin/webpack.js --progress --hide-modules --config=node_modules/laravel-mix/setup/webpack.config.js 
 95% emitting                                                                            

 ERROR  Failed to compile with 1 errors                                                                                                                                                                  1:04:09 PM

 error  

/js/app.js from UglifyJs
Unexpected token: operator (>) [./node_modules/vue-strap/src/utils/utils.js:4,0][/js/app.js:28275,16]


                                    Asset     Size  Chunks                    Chunk Names
....

ruchernchong · 2017-06-27T10:09:39Z

Wow. This is really weird.

Who's version of vue-strap is this?

ipa1981 · 2017-06-27T10:25:50Z

Ok.. cleaned up everything. Just to leave bare minimum:

webpack.mix.js

const { mix } = require('laravel-mix');

mix.js('resources/assets/js/app.js', 'public/js')

package.json

{
  "private": true,
  "scripts": {
    "watch": "cross-env NODE_ENV=development node_modules/webpack/bin/webpack.js --watch --progress --hide-modules --config=node_modules/laravel-mix/setup/webpack.config.js",
    "production": "cross-env NODE_ENV=production node_modules/webpack/bin/webpack.js --progress --hide-modules --config=node_modules/laravel-mix/setup/webpack.config.js"
  },
  "devDependencies": {
    "cross-env": "^5.0.1",
    "laravel-mix": "^1.0.7",
    "vue-strap": "git+https://github.com/yuche/vue-strap.git#v2"
  }
}

app.js

Vue.component('alert', require('../../../node_modules/vue-strap/src/Alert.vue'))

Running watch (OK):

$ yarn run watch
yarn run v0.24.6
$ cross-env NODE_ENV=development node_modules/webpack/bin/webpack.js --watch --progress --hide-modules --config=node_modules/laravel-mix/setup/webpack.config.js 
 10% building modules 1/1 modules 0 active                                         
Webpack is watching the files…

 95% emitting                                                                        

 DONE  Compiled successfully in 1003ms                                                                                                                                                                   1:24:00 PM

     Asset     Size  Chunks             Chunk Names
     /js/app.js  28.2 kB       0  [emitted]  /js/app

Running production (fails):

$ yarn run production
yarn run v0.24.6
$ cross-env NODE_ENV=production node_modules/webpack/bin/webpack.js --progress --hide-modules --config=node_modules/laravel-mix/setup/webpack.config.js 
 95% emitting                                                                        

 ERROR  Failed to compile with 1 errors                                                                                                                                                                  1:20:36 PM

 error  

/js/app.js from UglifyJs
Unexpected token: operator (>) [./node_modules/vue-strap/src/utils/utils.js:4,0][/js/app.js:738,16]

     Asset     Size  Chunks             Chunk Names
/js/app.js  26.3 kB       0  [emitted]  /js/app
error Command failed with exit code 2.
info Visit https://yarnpkg.com/en/docs/cli/run for documentation about this command.

ruchernchong · 2017-06-27T15:56:45Z

@ipa1981 yarnpkg/yarn#3737

This seemed related to your problem. It seemed like Yarn is not installing uglify-js.

ghost · 2017-06-28T07:17:42Z

Have you tried the latest stable yarn release?

ipa1981 · 2017-06-28T10:04:19Z

@ruchern I've added uglify-js manually, but same result.
Actually it's visible that the error is from UglifyJs itself

 error  

/js/app.js from UglifyJs
Unexpected token: operator (>) [./node_modules/vue-strap/src/utils/utils.js:4,0][/js/app.js:738,16]

@JHabdas Yes:

$ yarn --version
0.24.6

ipa1981 · 2017-06-28T10:07:00Z

BTW. I see that I require a *.vue file rather than *.js, in this example. Maybe there is a difference in processing?

ghost · 2017-06-28T10:24:26Z

@ipa1981 🤦‍♂️ sorry when I said stable I was thinking of 0.27 since 🐈 is still in active development.

ipa1981 · 2017-06-28T10:46:55Z

Ok. it seems yarn is not relevant here, I try npm run production with same result.
But things getting crazy :). I made example repo to replicate an issue.

https://github.com/ipa1981/laravel-mix-production-test

Run npm install
Run npm run watch - it compiles
Run npm run production - it fails

However I found that it fails only when vue-strap component is imported from node_modules folder, and compiles well if imported from local copy:

app.js

// This works (copy of file from node_modules folder)
import * as x from './local/utils.js'

// This fails on UglifyJS
import * as y from './node_modules/vue-strap/src/utils/utils.js'

Does it help? :)

ghost · 2017-06-28T10:49:18Z

Ah. If it's not yarn I have a present for you: https://www.npmjs.com/package/uglify-es

ipa1981 · 2017-06-28T10:54:49Z

Maybe I can try, but how to use it with laravel-mix?
Still I wonder why current laravel-mix handles local copy of JS file, and fails on minimization of node_modules located JS file?

ghost · 2017-06-28T10:56:36Z

Damn. Looks like I should learn to read good. #790 (comment). stepping out. don't actually use this module 😉

ipa1981 · 2017-06-28T11:53:33Z

:) it happens.

Would be glad if @JeffreyWay could look on this.

ruchernchong · 2017-06-28T12:39:50Z

@ipa1981 I have fixed your issue.

In your app.js file,

Use this instead of anything else.

import {utils} from "vue-strap";

ipa1981 · 2017-06-28T18:14:05Z

@ruchern thanks a lot, seems this works! Not exactly as you proposed, but in original app.js file I had to change this:

Vue.component('alert', require('../../../node_modules/vue-strap/src/Alert.vue'))

to this

Vue.component('alert', require('vue-strap').alert)

I don't know what's the difference however, but this goes to compile.

OzairP · 2017-06-28T20:39:20Z

I'm still getting errors for shorthand closures.

@JeffreyWay perhaps swap from JSUglify to https://github.com/babel/babili ? Babili supports ES6

ipa1981 · 2017-06-30T08:54:11Z

@ruchern Seems the solution is not good :/.

Using

Vue.component('sidebar', require('vue-strap').aside)

Is not the same as

Vue.component('sidebar', require('../../../node_modules/vue-strap/src/Aside.vue'))

First does not include styles and template of the component, so final code is getting broken.

ruchernchong · 2017-06-30T11:01:12Z

Lets try this.

import {aside} from 'vue-strap'

Vue.component('sidebar', aside)

Let me know if it works this way.

ipa1981 · 2017-06-30T11:14:07Z

@ruchern, thanks for ideas! I just tried many different things. And it seems CommonJS syntax:

Vue.component('sidebar', require('vue-strap').aside)

finally works with latest vue-loader 13.0.0 (I had 12.2.1 on the time testing).

So at the moment it looks like everything is fine - both watch and production scripts compiles.

StygianTraveler · 2017-06-30T14:19:10Z

@ipa1981 If you import your Vue-Strap components that way, do you not get style conflicts with regular Bootstrap checkboxes/radios, as per this issue? yuche/vue-strap#390

Maybe you don't use regular checkboxes or radio buttons, though. My issue is that I switched the import to the vue-strap/src/* path to avoid the radio button problem, but now I have this UglifyJs issue that seems to require the opposite. Very annoying.

By the way, probably a dumb question, but how do you update the version of vue-loader that laravel-mix is using? I don't know if that would help in any way, but since you mention updating to 13.0.0, I thought I'd give it a shot. I see the latest laravel-mix uses 12.1.1... But just installing 13.0.0 in my own project is not going to make laravel-mix use it, is it?

ruchernchong · 2017-06-30T16:40:22Z

@ipa1981 Alright. Good to hear everything is working now.

ipa1981 · 2017-06-30T17:11:01Z

@StygianTraveler Haven't noticed this problem. Maybe I simply don't use some conflicting styles. I don't remember why I used direct require rather than generic one. Probably there was a reason, but I cannot recall why.

To update a version on vue-loader simply npm install vue-loader :) it looks like laravel-mix uses it well. Please notice, you will have to do some changes in code as 1.3.0 has some breaking changes (look in release notes https://github.com/vuejs/vue-loader/releases/tag/v13.0.0

MarcusJay · 2018-02-07T03:36:46Z

note: using normalize-url with nextjs triggers this error as well

hozefaj · 2018-02-14T21:50:22Z

For webpack v3 onwards the aliasing for UglifyJS is changed. Refer https://github.com/webpack-contrib/uglifyjs-webpack-plugin.

So for me modifying my webpack.config.js from to use new UglifyJsPlugin() rather than new webpack.optimize.UglifyJsPlugin() fixed the issue.

Reference: joeeames/WebpackFundamentalsCourse#3 (comment)

emp · 2018-03-08T14:58:58Z

My babel ES2015 preset was excluding /node_modules/ and this would end up not converting some newer modules before uglify saw the code and it choked on the arrow function like the OP title, adding node_modules back solved the issue here (Webpack)

    {
        test: /\.js$/,
        loader: 'babel-loader',
        query: {
          presets: ["es2015"],
        },
        exclude: /node_modules/ <-- REMOVE THIS
      },

picheli20 · 2018-03-18T23:51:12Z

Looks really similar to this issue: webpack/webpack#2972 (comment)

I've fixed with that comment

theomails · 2018-03-20T17:48:09Z

"I have the same problem when my code has the syntax class. And then I found it's my fault because I forget to write .babelrc." from webpack/webpack#2972 (comment)

jakobgriogoryan · 2018-09-25T19:19:02Z

https://www.npmjs.com/package/vue-strap

Ivor · 2021-12-13T13:59:45Z

Switching to use https://webpack.js.org/plugins/terser-webpack-plugin/ instead of UglifyJS worked for me.

JeffreyWay closed this as completed May 23, 2017

shershen08 mentioned this issue Aug 8, 2017

Uglifier complains with Unexpected token: operator (>) in 0.10.5 shershen08/vue-masonry#24

Closed

iabok mentioned this issue Apr 10, 2019

Webpack UglifyJs is failing each time i run a production build rmartide/vue-google-login#2

Closed

bchrobot mentioned this issue Jan 17, 2020

build: fix building in docker context politics-rewired/Spoke#490

Merged

lxfu1 mentioned this issue Jun 17, 2020

ERROR in vendor-xx.min.js from UglifyJs in Production ant-design/ant-design-charts#83

Closed

UglifyJs: Unexpected token: operator (>) #790

UglifyJs: Unexpected token: operator (>) #790

Comments

tillkruss commented May 8, 2017 • edited Loading

hernandev commented May 8, 2017

tillkruss commented May 9, 2017

Shchepotin commented May 9, 2017

suhaibmalik commented May 13, 2017

robbyrice commented May 13, 2017

TheYorickable commented May 14, 2017

bbashy commented May 19, 2017

JeffreyWay commented May 23, 2017

tillkruss commented May 24, 2017

ipa1981 commented May 30, 2017

tillkruss commented May 30, 2017

balthild commented Jun 24, 2017

iraklisg commented Jun 27, 2017

ipa1981 commented Jun 27, 2017

ruchernchong commented Jun 27, 2017 • edited Loading

ipa1981 commented Jun 27, 2017

ruchernchong commented Jun 27, 2017

ipa1981 commented Jun 27, 2017 • edited Loading

ruchernchong commented Jun 27, 2017 • edited Loading

ipa1981 commented Jun 27, 2017 • edited Loading

ruchernchong commented Jun 27, 2017 • edited Loading

ghost commented Jun 28, 2017

ipa1981 commented Jun 28, 2017

ipa1981 commented Jun 28, 2017

ghost commented Jun 28, 2017

ipa1981 commented Jun 28, 2017 • edited Loading

ghost commented Jun 28, 2017

ipa1981 commented Jun 28, 2017

ghost commented Jun 28, 2017

ipa1981 commented Jun 28, 2017

ruchernchong commented Jun 28, 2017

ipa1981 commented Jun 28, 2017 • edited Loading

OzairP commented Jun 28, 2017

ipa1981 commented Jun 30, 2017

ruchernchong commented Jun 30, 2017

ipa1981 commented Jun 30, 2017

StygianTraveler commented Jun 30, 2017

ruchernchong commented Jun 30, 2017

ipa1981 commented Jun 30, 2017

MarcusJay commented Feb 7, 2018

hozefaj commented Feb 14, 2018 • edited Loading

emp commented Mar 8, 2018 • edited Loading

picheli20 commented Mar 18, 2018

theomails commented Mar 20, 2018

jakobgriogoryan commented Sep 25, 2018

Ivor commented Dec 13, 2021

tillkruss commented May 8, 2017 •

edited

Loading

ruchernchong commented Jun 27, 2017 •

edited

Loading

ipa1981 commented Jun 27, 2017 •

edited

Loading

ruchernchong commented Jun 27, 2017 •

edited

Loading

ipa1981 commented Jun 27, 2017 •

edited

Loading

ruchernchong commented Jun 27, 2017 •

edited

Loading

ipa1981 commented Jun 28, 2017 •

edited

Loading

ipa1981 commented Jun 28, 2017 •

edited

Loading

hozefaj commented Feb 14, 2018 •

edited

Loading

emp commented Mar 8, 2018 •

edited

Loading