javascript - from uglifyjs unexpected token: punc

Uglify SyntaxError: token inesperado: punc())

Question

Estoy tratando de usar gulp para minificar una carpeta que contiene archivos JS. Sin embargo, uno de los archivos tiene el error anterior, lo que impide que se minimice.

Logré atrapar e imprimir el error, que he impreso parcialmente aquí:

JS_Parse_Error {
message: ''SyntaxError: Unexpected token: punc ())'',
filename: ''ex.js'',
line: 189,
col: 25,
pos: 6482,
stack: Error/n at new JS_Parse_Error (eval at <anonymous> ... )
plugin: ''gulp-uglify'',
fileName: ''.../js/ex.js'',
showStack: false
}

El archivo en cuestión contiene lo siguiente, acortado:

function() {
...
$.confirm({
buttons: {
confirm: function() {
$.post(''/ajax-handler'', {
...
})
.done( function(response) {
var data = filterResponse(response);
if (data[''status''] == ''success'') {
sleep(1000).then(() => {
* ...
});
sleep(5000).then(() => {
...
});
} else {
console.log(''Oops!'');
}
})
.fail( function(err, status, response) {
...
});
},
cancel: function() {}
}
});
...
}

Agregué el "*" anterior para indicar la posición exacta enumerada por JS_Parse_Error.

Answer 1

// Actualización

De los comentarios ~ @imolit

v2.0.0 (2018-09-14) - ROMPIENDO CAMBIOS (link)

Vuelva a uglify-js (uglify-es está abandonado, si necesita el código uglify ES6, use terser-webpack-plugin ).

Respuesta original antes de la actualización ...

Espero que pueda inspirarse con esta solución que funciona con webpack. (enlace debajo)

Simplemente enseñe UglifyJS ES6

Hay dos versiones de UglifyJS: ES5 y ES6 (Harmony), ver en git
La versión ES5 viene por defecto con todos los complementos, pero si instala una versión de Harmony explícitamente, esos complementos la usarán en su lugar.

package.json

"uglify-js": "git+https://github.com/mishoo/UglifyJS2.git#harmony"

o

npm install --save uglify-js@github:mishoo/UglifyJS2#harmony
yarn add git://github.com/mishoo/UglifyJS2#harmony --dev

Paquete web

Para usarlo con webpack, instale también el complemento webpack

npm install uglifyjs-webpack-plugin --save-dev
yarn add uglifyjs-webpack-plugin --dev

luego importe el complemento instalado manualmente

var UglifyJSPlugin = require(''uglifyjs-webpack-plugin'');

y reemplazarlo en el código

- new webpack.optimize.UglifyJsPlugin({ ... })
+ new UglifyJSPlugin({ ... })

Para obtener más información sobre el paquete web (Instalación / Uso), consulte https://github.com/webpack-contrib/uglifyjs-webpack-plugin#install

Answer 2

Agregue la dependencia babel-preset-es2015 para solucionar esto.

Y también agregue ''es2015'' en el archivo .babelrc .

json
{
"presets": ["es2015"]
}

Answer 3

Agregue stage-3 a los presets en el archivo .babelrc.

{
"presets": [
"stage-3"
]
}

Answer 4

Para mí no tenía nada que ver con que Uglify no funcionara correctamente, sino que era una dependencia (en este caso, una promesa vacía) que aún no se había compilado en ES5. Como acabamos de importar el archivo fuente sin procesar, pero babel solo está transpilando archivos fuera de node_modules, uglify se confundió con la sintaxis de ES6.

Simplemente verifique si alguna dependencia que haya agregado recientemente podría no tener una compilación "dist".

Answer 5

Si recibió este error al usar Grunt (grunt-contrib-uglify), la solución es instalar la versión ES6 del complemento:

npm install grunt-contrib-uglify-es --save-dev

Answer 6

Tengo el mismo problema, encontré una gran respuesta here que me ayudó a llegar al archivo que estaba causando el error.

Vaya a la consola de Rails y pegue:

JS_PATH = "app/assets/javascripts/**/*.js";
Dir[JS_PATH].each do |file_name|
puts "/n#{file_name}"
puts Uglifier.compile(File.read(file_name))
end

Espero que ayude a alguien!

Answer 7

Tuve el mismo problema contigo. Estaba usando gulp.js. Resolví este problema gracias a que los archivos js cambian el formato ES. Por ejemplo, antes de resolver es mi código:

for (district for response) {
$(''#districts'').append(''<option value="'' + district.id + ''">'' + district.name + ''</option>'');
$(''#districts'').removeAttr(''disabled'');
}

después del código de reparación:

for (district in response) {
$(''#districts'').append(''<option value="'' + district.id + ''">'' + district.name + ''</option>'');
$(''#districts'').removeAttr(''disabled'');
}

En resumen, el problema se debe a Ecma-uglify.js.

Answer 8

npm install uglifyjs-webpack-plugin --save-dev no es suficiente

El problema principal es "uglifyjs-webpack-plugin": "^0.4.6" en el paquete web.json

Según semver , ^0.4.6 := >=0.4.6 <0.5.0 . Debido al cero webpack , webpack nunca usará el 1.0.0-beta.2 .

Entonces, después de ejecutar npm i -D uglifyjs-webpack-plugin@beta , debe realizar un paso más que es rm -rf node_modules/webpack/node_modules/uglifyjs-webpack-plugin . Luego, webpack recogerá la versión de node_modules/uglifyjs-webpack-plugin lugar de node_modules/webpack/node_modules/uglifyjs-webpack-plugin

Actualización en 2018-04-18: webpack v4 no tiene este problema