UglifyJS выдает неожиданный токен: ключевое слово (const) с node_modules
Небольшой проект, который я начал делать, использует модуль узла (установленный через npm), который объявляет переменные const
. Запуск и тестирование этого проекта хорошо, но browserify завершается неудачно при выполнении UglifyJS.
Неожиданный токен: ключевое слово (const)
Вот общий файл Gulp, который я успешно использовал для нескольких других прошлых проектов без этой проблемы (т.е. без этого конкретного модуля узла).
gulpfile.js
'use strict';
const browserify = require('browserify');
const gulp = require('gulp');
const source = require('vinyl-source-stream');
const derequire = require('gulp-derequire');
const buffer = require('vinyl-buffer');
const uglify = require('gulp-uglify');
const sourcemaps = require('gulp-sourcemaps');
const gutil = require('gulp-util');
const path = require('path');
const pkg = require('./package');
const upperCamelCase = require('uppercamelcase');
const SRC_PATH = path.dirname(pkg.main);
const DIST_PATH = path.dirname(pkg.browser);
const INPUT_FILE = path.basename(pkg.main);
const OUTPUT_FILE = path.basename(pkg.browser);
const MODULE_NAME = upperCamelCase(pkg.name);
gulp.task('default', () => {
// set up the browserify instance on a task basis
var b = browserify({
entries: INPUT_FILE,
basedir: SRC_PATH,
transform: ['babelify'],
standalone: MODULE_NAME,
debug: true
});
return b.bundle()
.pipe(source(OUTPUT_FILE))
.pipe(buffer())
.pipe(derequire())
.pipe(sourcemaps.init({loadMaps: true}))
.pipe(uglify())
.on('error', gutil.log)
.pipe(sourcemaps.write('.'))
.pipe(gulp.dest(DIST_PATH))
;
});
Я попытался исправить это, заменив все const
на var
в этом npm-установленном модуле, и все в порядке. Поэтому я не понимаю провал.
Что не так с const
? Если кто-то не использует IE10, все основные браузеры поддерживают этот синтаксис.
Есть ли способ исправить это, не требуя изменения в этом модуле узла?
Обновить
Я временно (или навсегда) заменил UglifyJS на Butternut и, похоже, работает.
Ответы
Ответ 1
Ноябрь 2018 обновление:
Используйте terser-webpack-plugin для ES6 (webpack @5 будет использовать этот плагин для uglification)
npm install terser-webpack-plugin --save-dev
Затем определите в своем массиве plugins
const TerserPlugin = require('terser-webpack-plugin')
new TerserPlugin({
parallel: true,
terserOptions: {
ecma: 6,
},
}),
Источник
Ответ 2
UglifyJS не поддерживает es6. const
является объявлением es6, поэтому выдает ошибку.
Что странно, так это то, что используемый вами пакет не передает свои файлы в es5 для использования в любом месте.
Если вы все еще хотите использовать UglifyJS (например, для повторного использования конфигурации), используйте ES6+ совместимую версию, uglify-es. (Предупреждение: uglify-es
теперь заброшен.)
И, как terser-webpack-plugin
Сер, теперь вы должны использовать terser-webpack-plugin
.
Ответ 3
У меня только что была эта проблема с проектом Gulp, который я реорганизовал, и по какой-то причине у меня были проблемы с официальным плагином Terser Gulp. Этот (глотатель) работал без проблем.
Ответ 4
Лучше используйте uglify-es-webpack-plugin
const UglifyEsPlugin = require('uglify-es-webpack-plugin')
module.exports = {
plugins: [
new UglifyEsPlugin({
compress:{
drop_console: true
}
}),
]
}
Ответ 5
Я заменил UglifyJS
на YUI Compressor JS
внутри графического интерфейса PHPStorm. Теперь это работает.
Ответ 6
Я не думаю, что этот подход хорош, но в моем случае мне нужно было сделать это один раз и забыть об этом, поэтому я просто зашел на веб-сайт babel, перевел es6 на es5 онлайн и заменил вывод !