Как настроить Babel чтобы он показывал ошибки при сборке?

Для настройки Babel так, чтобы он показывал ошибки при сборке, вам потребуется внести несколько изменений в ваш файл gulpfile.js.

Во-первых, убедитесь, что у вас установлен пакет gulp-babel. Если он еще не установлен, выполните следующую команду в вашей командной строке:

npm install --save-dev gulp-babel

Затем, импортируйте пакет gulp-babel в вашем gulpfile.js, добавив следующую строку:

const babel = require('gulp-babel');

Затем, настройте таск Gulp, в котором вы будете использовать Babel. Например, если у вас есть таск для сборки вашего JavaScript кода, вы можете добавить babel() пайп в этот таск. Вот пример:

gulp.task('js', function () {
    return gulp.src('src/**/*.js')
        .pipe(babel())
        .pipe(gulp.dest('dist'));
});

В этом примере мы передаем все файлы с расширением .js из папки src в плагин Babel, а затем сохраняем результат в папку dist.

Однако, чтобы показывать ошибки при сборке, вам также потребуется установить и настроить соответствующий плагин. Если вы хотите использовать Babel для транспиляции кода ES6+ в код ES5 с проверкой синтаксиса исходного кода, вы можете использовать плагин @babel/eslint-parser.

Для начала, установите пакет @babel/eslint-parser:

npm install --save-dev @babel/eslint-parser

Затем, добавьте плагин в ваш файл конфигурации .eslintrc, чтобы он мог анализировать синтаксис JavaScript файлов, включая код, транспилированный Babel. Вот пример:

{
  "parser": "@babel/eslint-parser",
  "parserOptions": {
    "requireConfigFile": false
  }
}

Теперь при сборке вашего проекта с помощью Gulp и Babel, вы будете видеть ошибки и предупреждения в вашем коде JavaScript, как если бы вы использовали ESLint.

Это только один из способов настройки Babel для отображения ошибок при сборке. Возможно, вам также потребуется настроить другие инструменты и плагины, в зависимости от ваших конкретных требований и настроек проекта.