Как научить компилятор js обрабатывать конструкцию опциональной цепочки '?.' в gulp?
Пытаюсь скомпилировать код типа
const unit = newInput.closest("[data-unit]")?.dataset.unit; |
const unit = newInput.closest("[data-unit]")?.dataset.unit;
с использованием опциональной цепочки. Но компилятор при использовании gulp-minify на шаге .pipe(minify()) выдает ошибку:
[04:18:25] 'js-concat' errored after 2.47 s [04:18:25] TypeError in plugin "gulp-minify" Message: srcjschat_chat.js Cannot read properties of undefined (reading 'replace') (line: undefined, col: undefined, pos: undefined Details: domainEmitter: [object Object] domainThrown: false |
[04:18:25] 'js-concat' errored after 2.47 s [04:18:25] TypeError in plugin "gulp-minify" Message: srcjschat_chat.js Cannot read properties of undefined (reading 'replace') (line: undefined, col: undefined, pos: undefined Details: domainEmitter: [object Object] domainThrown: false
*Но эти ошибки как правило малоинформативны
Без минификации все работает нормально. Как подружить опциональную цепочку и минификатор?
Дополнительно:
Замени на связку:
import babel from "gulp-babel"; import uglify from "gulp-uglify"; |
import babel from "gulp-babel"; import uglify from "gulp-uglify";
.pipe( babel({ presets: ["@babel/env"], }) ) .pipe(uglify()) |
.pipe( babel({ presets: ["@babel/env"], }) ) .pipe(uglify())
В общем, я покопалась и выяснила, что gulp-minify использует terser и чтобы последний компилировал опциональные цепочки, нужно обновить terser на версию не меньше 5.2.0, но при этом ваш код полностью должен соответствовать стандарту ECMAScript 6. Мой видимо не совсем соответствует, потому что посыпались ошибки. Пришлось откатиться. А потом и правда перейти gulp-uglify, он работает корректно, спасибо комментатору выше за совет)
- да тогда уж бери esbuild
Опишите проблему, и специалист поможет с настройкой, исправлением ошибки или доработкой сайта. Подберём понятный план работ без лишней переписки.
Пока нет других ответов. Будьте первым, кто поможет автору.
Ответить на вопрос
Для того чтобы научить компилятор JS, например Babel, обрабатывать конструкцию опциональной цепочки '?.', необходимо использовать плагин @babel/plugin-proposal-optional-chaining. Этот плагин добавляет поддержку опциональной цепочки в Babel, что позволяет использовать эту конструкцию в вашем коде.
Для того чтобы добавить этот плагин в ваш проект Gulp, вам необходимо установить его через npm:
```bash
npm install --save-dev @babel/plugin-proposal-optional-chaining
```
Затем в вашем файле конфигурации Babel (обычно это файл .babelrc или babel.config.js) добавьте этот плагин в список плагинов:
```json
{
"plugins": ["@babel/plugin-proposal-optional-chaining"]
}
```
После этого Babel будет успешно компилировать код, в котором используется опциональная цепочка '?.', и вы сможете использовать эту конструкцию в вашем проекте Gulp.
Надеюсь, это поможет вам решить проблему с обработкой опциональной цепочки в вашем проекте Gulp. Если у вас возникнут дополнительные вопросы, не стесняйтесь задавать их. Буду рад помочь!