Uglify SyntaxError: Неожиданный токен: punc())

Я пытаюсь использовать gulp, чтобы минимизировать папку, содержащую файлы JS. Тем не менее, один из файлов имеет указанную выше ошибку, предотвращая ее минимизацию.

Мне удалось поймать и распечатать ошибку, которую я частично распечатал здесь:

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
}

Этот файл содержит следующие сокращения:

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() {}
    }
 });
  ...
}

Я добавил "*" выше, чтобы указать точную позицию, указанную JS_Parse_Error.

Ответы

Ответ 1

// Обновить

Из комментариев ~ @imolit

v2.0.0 (2018-09-14) - ИЗМЕНЕНИЯ НАРУШЕНИЯ (ссылка)

Вернитесь к uglify-js (uglify-es отменяется, если вам нужно uglify код ES6, пожалуйста, используйте terser-webpack-plugin).

Оригинальный ответ до обновления...

Я надеюсь, что вы можете вдохновиться этим решением, которое работает с веб-пакетом. (ссылка ниже)

Просто научи UglifyJS ES6

Существует две версии UglifyJS - ES5 и ES6 (Harmony), см. на git
Версия ES5 поставляется по умолчанию со всеми плагинами, но если вы установите версию Harmony явно, эти плагины будут использовать ее вместо.

package.json

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

или же

npm install --save [email protected]:mishoo/UglifyJS2#harmony

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

Webpack

Для использования с веб-пакетом установите также плагин веб-пакета

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

yarn add uglifyjs-webpack-plugin --dev

затем импортируйте установленный вручную плагин

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

и заменить его в коде

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

Для получения дополнительной информации о веб-пакете (установка/использование) см. Https://github.com/webpack-contrib/uglifyjs-webpack-plugin#install.

Ответ 2

npm install uglifyjs-webpack-plugin --save-Dev недостаточно

Основная проблема - "uglifyjs-webpack-plugin": "^0.4.6" в webpack package.json

Согласно semver, ^0.4.6 :=>=0.4.6 <0.5.0. Из-за webpack нуля webpack никогда не будет использовать 1.0.0-beta.2.

Поэтому после запуска npm я -D [email protected] вам нужно сделать еще один шаг, который представляет собой rm -rf node_modules/webpack/node_modules/uglifyjs-webpack-plugin. Затем webpack подберет версию из node_modules/uglifyjs-webpack-plugin вместо node_modules/webpack/node_modules/uglifyjs-webpack-plugin

Обновление 2018-04-18: у webpack v4 нет этой проблемы

Ответ 3

Добавьте исправление babel-preset-es2015 чтобы исправить это.

А также добавьте 'es2015' в файл .babelrc.

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

Ответ 4

У меня та же проблема, я нашел большие ответы здесь, которые помогли мне достичь файл, который вызывает ошибку.

Перейдите в Rails Console и Paste:

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

Надеюсь, это поможет кому-то!

Ответ 5

Для меня это не имело ничего общего с тем, что Uglify работает некорректно, а скорее зависимость (в данном случае пустая-обещают), которая еще не была скомпилирована в ES5. Поскольку мы только импортировали исходный файл, но babel только переводит файлы за пределы node_modules, uglify запутался в синтаксисе ES6.

Просто проверьте, не имеет ли какая-либо зависимость, которую вы недавно добавили, не имеет сборки "dist".

Ответ 6

Добавьте этап-3 в пресеты в файле.babelrc.

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

Ответ 7

У меня была с тобой такая же проблема. Я использовал gulp.js. Я решил эту проблему благодаря js файлам, изменяющим формат ES. Например, до того, как был решен мой код:

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

после исправления кода:

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

Таким образом, проблема связана с Ecma-uglify.js.

Ответ 8

Если вы получили эту ошибку, используя Grunt (grunt-contrib-uglify), решение состоит в том, чтобы установить версию плагина ES6:

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