dsampaolo's avatar

gulp --production failing

I'm using Webpack to "compile" a bunch of Vue components, inside of a Laravel 5.3 project.

gulp is working fine but gulp --production throws an error :

  { Error

at new JS_Parse_Error (eval at <anonymous> (/var/www/node_modules/gulp-uglify/node_modules/uglify-js/tools/node.js:28:1), <anonymous>:1534:18)

[...snip...]

 message: '/var/www/app.js: SyntaxError: Unexpected token: name (newElement)',

  fileName: '/var/www/app.js',

  lineNumber: 115184,

[...snip...]

I tried to update node, npm and my packages. I deleted node_modules and ran npm i again.

My main problem is that the file state (/var/www/app.js) doesn't even exists, and my /public/js/app.js file doesn't have 115184 lines.

My app.js file is getting bigger every day (almost 9Mo ATM) and I really need to uglify it...

Here is my gulpfile.js :

elixir(mix => {

    mix.sass('app.scss')

      .webpack('app.js', 'public/js')

      .version([

          'css/app.css',

          'js/app.js'

      ], 'public');

Any hints on how to debug this issue would be VERY appreciated. Thank you !

0 likes
9 replies
HomiWong's avatar

Maybe there is a JS syntax error near name (newElement) in your app.js.

1 like
dsampaolo's avatar

Hi,

Yeah, my question was not clear. I'd like to know how I can find where name (newElement) is, from the stacktrace.

I suspect the errors to be inside my node_module directory, so it's hard for me to know what's wrong.

As gulp works like a charm (and to app too), it's really hard for me to understand the problem.

gabrielbuzzi's avatar

Just tried and got the same error Laravel 5.3 and VueJS 2

ejdelmonico's avatar

What are you using as the server? If its WAMP or XAMP, there have been many different issues with webpack throwing errors. The reason the file has so many lines is that webpack adds a lot of comments to the compiled code...a whole bunch for that matter. The comments will disappear when you use the --production flag successfully.

Also, make sure you are running the most current version of node.

dsampaolo's avatar

Hi,

I'm using the current stable node version, I'm hosting my project under LaraDock (Docker for Laravel), so it's a full linux host. I also tried in a "simple" Debian (my work computer) with no more luck, so the issue isn't docker-related.

After a lot of trial and error (disabling every component one by one), I could pinpoint that the error lies in "medium-editor" package (^5.22.1).

Unfortunately, this package contains a lot of files (almost 150) and the error I have doesn't allow me to know exactly where the error happens.

Current error :

message: '/var/www/app.js: SyntaxError: Unexpected token punc «(», expected punc «:»',
  fileName: '/var/www/app.js',
  lineNumber: 119509,

The file doesn't exist in /var/www, so I can't even open it with a text editor to see what's happening.

If someone could point me in the right direction, I could try to resolve the issue or at least submit a bug report.

I'm still using Laravel Elixir with Webpack.

avoostrum's avatar

Hi @dsampaolo, did you manage to solve this issue from a few months ago? I'm having the exact same issue (although with a different "token" and line number :-))

suhaib.malik's avatar

Having a very similar problem while trying to do npm run production with vue2-medium-editor.

/js/app.1ab482634b0049c4cd2f.js from UglifyJs
Unexpected token: name (newElement) [./~/vue2-medium-editor/vue-medium-editor.js:7,0][/js/app.1ab482634b0049c4cd2f.js:32728,6]

Here's what's near those lines:

function replaceElementWith (element, tagName) {
  let newElement = document.createElement(tagName)
  element.parentNode.replaceChild(newElement, element)
  return newElement
}

/* harmony default export */ __webpack_exports__["a"] = ({
  name: 'medium-editor',
  props: {
    text: [String],
    customTag: [String],
    options: {
      type: [Object],
      default: function () {
        return {}
      }
    }
  },
  template: '<div ref="element" v-html="text"> </div>',

Line 32728,6 is the let newElement = ...

suhaib.malik's avatar

Update: So after a bunch of digging I'm confident that this issue is related to lack of es2016 support in uglify.

2 likes

Please or to participate in this conversation.