⚠️ Vue CLI is in Maintenance Mode!

For new projects, it is now recommended to use create-vue to scaffold Vite-based projects. Also refer to the Vue 3 Tooling Guide for the latest recommendations.

@vue/cli-plugin-babel

Плагин babel для vue-cli

Конфигурация

По умолчанию используется Babel 7 + babel-loader + @vue/babel-preset-app, но есть возможность конфигурации через babel.config.js для использования любых других пресетов Babel или плагинов.

По умолчанию babel-loader исключает файлы внутри зависимостей из node_modules. Если вы хотите явно транспилировать модуль какой-то зависимости, необходимо указать его в опции transpileDependencies в файле vue.config.js:

module.exports = {
  transpileDependencies: [
    // может быть строкой или regex
    'my-dep',
    /other-dep/
  ]
}

Кэширование

cache-loader используется по умолчанию, кэш хранится в <projectRoot>/node_modules/.cache/babel-loader.

Параллелизация

thread-loader используется по умолчанию, если машина имеет более 1 ядра CPU. Это можно отключить указав parallel: false в файле vue.config.js.

Опция parallel должна быть установлена в false при использовании Babel в комбинации с не-сериализуемыми опциями загрузчика, таким как регулярные выражения, даты и функции. Такие опции не будут корректно переданы в babel-loader, что может привести к неожиданным ошибкам.

Установка в уже созданный проект

vue add babel

Внедряемые правила webpack-chain

  • config.rule('js')
  • config.rule('js').use('babel-loader')
  • config.rule('js').use('cache-loader')