Transpile Async Ожидаете предложения с Babel.js?

Есть предложение по внедрению стиля C# async-await, Я знаю, что Babel.js переносит ES6 в ES5, но есть ли способ заставить его переносить асинхронное ожидание в ES5?

Источник

5 ответов

Решение

Бабель v6

Начиная с Babel v6, Babel больше не содержит никаких трансформеров. Вы должны явно указать любую функцию, которую вы хотите преобразовать.

Пресеты - не в среде ES2015

Самый быстрый способ добиться этого - использовать предустановки, которые уже содержат набор плагинов, необходимых для преобразования ES2015 и более новых предложений. За async Вам понадобится es2015 а также es2017 пресеты и runtime плагин (не забудьте установить babel-runtime как описано в документации):

{
  "presets": [
    "es2015",
    "es2017"
  ],
  "plugins": [
    "transform-runtime"
  ]
}

Пресеты - среда ES2015

Если вы запускаете код в среде, которая поддерживает ES2015 (в частности, генераторы и обещания), то все, что вам нужно, это предустановка es2017:

{
  "presets": [
    "es2017"
  ]
}

изготовленный на заказ

Чтобы только преобразовать async функции, вам понадобятся следующие плагины.

syntax-async-functions необходим в любом случае, чтобы иметь возможность разбирать асинхронные функции

Чтобы запустить асинхронную функцию, вам нужно либо использовать

  • transform-async-to-generator: Преобразует async функция в генератор. Это будет использовать собственную "сопутствующую" реализацию Babel.
  • transform-async-to-module-method: Также преобразует async функция генератору, но передает его модулю и методу, указанному в конфигурации, вместо собственного метода Бабеля. Это позволяет использовать внешние библиотеки, такие как bluebird,

Если ваш код работает в среде, которая поддерживает генераторы, то делать больше нечего. Однако, если целевая среда не поддерживает генераторы, вам также придется трансформировать генератор. Это делается через transform-regenerator преобразования. Это преобразование зависит от функций времени выполнения, поэтому вам также понадобится Babel's transform-runtime преобразовать (+ babel-runtime пакет).

Примеры:

Асинхронизация с генератором

{
  "plugins": [
    "syntax-async-functions",
    "transform-async-to-generator"
  ]
}

Асинхронизация с модульным методом

{
  "plugins": [
    "syntax-async-functions",
   ["transform-async-to-module-method", {
     "module": "bluebird",
     "method": "coroutine"
   }]
  ]
}

Асинхронизация с генератором + регенератором

{
  "plugins": [
    "syntax-async-functions",
    "transform-async-to-generator",
    "transform-regenerator",
    "transform-runtime"
  ]
}

Бабель v4 и старше

Да, вы должны включить экспериментальные трансформаторы. Бабель использует регенератор.

использование

$ babel --experimental

babel.transform("code", { experimental: true });
Источник

Это решение могло измениться (25 февраля, Феликс Клинг), или, возможно, есть еще несколько способов использования асинхронного ожидания.

Что сработало для нас, так это запустить Вавилон так

$ npm install babel-runtime

$ babel inputES7.js -o outputES5.js --optional runtime
Источник

Я получил это с сегодняшнего дня, выполнив дополнительную npm install babel-preset-stage-0 и используя его как

var babel = require("babel-core");
var transpiled = babel.transform(code, { "presets": ["stage-0"] });

Увидеть

Источник

Возможно, даже более актуальный сейчас; просто поместите материал babel в отдельный файл:

'use strict';

require('babel/register'); // Imports babel - auto transpiles the other stuff
require('./app'); // this is es6 - gets transpiled

См. Мой код в приложении " /questions/8277218/kak-ya-mogu-ispolzovat-es2016-es7-asyncawait-v-moih-priemochnyih-testah-dlya-prilozheniya-koajs для получения дополнительной информации.

Источник

Утвержденный ответ, похоже, устарел. Экспериментальный флаг устарел в пользу сцены.

http://babeljs.io/blog/2015/03/31/5.0.0/

использование

$ babel --stage 0

babel.transform("code", { stage: 0 });

Этап 0

  • es7.classProperties
  • es7.comprehensions

Этап 1

  • es7.asyncFunctions
  • es7.decorators
  • es7.exportExtensions
  • es7.objectRestSpread

Этап 2 (Этап 2 и выше включены по умолчанию)

  • es7.exponentiationOperator
Источник
Другие вопросы по тегам