Что такое Babel и его пресет для TypeScript

Вавилон

Babel — это компилятор JavaScript для Next Generation.

Как вы знаете, JavaScript широко используется в браузере для современных веб-приложений. Существует множество новых технологий и спецификаций, которые используются для разработки приложений JavaScript, таких как ES2015, TypeScript. Но они могут не поддерживаться большинством браузеров, может потребоваться компиляция или применение полифилла, чтобы заставить их работать в большинстве браузеров.

Вавилонская предустановка

Предустановка Babel — это набор плагинов, которые используются для определенных языковых функций.

Предустановленная конфигурация будет находиться в файле .babelrc.

например. @babel/preset-env

Этот пресет используется для преобразования последней спецификации JavaScript в ES2015 по умолчанию.

{
  "preset": [
    "@babel/preset-env"
  ]
}

если ваш целевой браузер не ES2015, вы хотите иметь поддержку более конкретного браузера, такого как IE. Список браузеров можно указать в файле .browserslistrc.

{
  target: {
    IE: "11" 
  } 
}

Предустановка TypeScript

Для поддержки TypeScript в файл .babelrc должен быть включен пресет-typescript.

{
  "preset": [
    "@babel/preset-env",
    "@babel/preset-typescript"
  ]
}

Библиотека NPM

Все вышеперечисленное является конфигурацией для Babel. Во время компиляции Babel потребуется библиотечный модуль, такой как @babel/preset-env и @babel/preset-typescript.

Кроме того, необходимо включить библиотеку Babel Core (@babel/core).

npm install --dev @babel/core @babel/preset-env @babel/preset-typescript

Затем вы скомпилируете свой код, написанный на ES2015+ и TypeScript, в JavaScript для разработки веб-приложений.

babel testing.ts > testing.js

Исходный код TypeScript

Скомпилированный JavaScript