Transpile ES7 to ES6 для современных браузеров

Question

У меня есть приложение реагирования, написанное на es6 / 7, которое я с радостью перенесу, используя babel на es5, чтобы быть совместимым со всеми браузерами.

Это заставило меня задуматься ...

Это так?можно создать js-пакет, переданный в es6, который затем может быть обработан, скажем, nginx, если это современный браузер?Это должно сэкономить на размере файла и, возможно, времени выполнения.

Answer 1

Да, вы можете использовать пресет Babels env для создания нескольких версий ваших пакетов, которые обеспечивают различные уровни совместимости с браузером.

Например, это .babelrc создаст пакет, совместимый с Firefox версии 50 и выше:

{
  "presets": [
    ["env", {
      "targets": {
        "browsers": ["Firefox > 50"]
      }
    }]
  ]
}

Без каких-либо параметров, плагин env создаст пакет, который работает в широком спектре браузеров, чтовероятно, будет намного больше, чем тот, который создан специально для современного браузера, такого как Firefox:

{
  "presets": ["env"]
}

Предустановка env использует browserslist для указания браузеров, которые должен использовать Babelкак мишень для транспиляции.Список браузеров содержит язык запросов, который позволяет вам указывать браузеры по типу, платформе, версии, статистике использования и т. Д. Изучите их документацию, чтобы выяснить, какие запросы использовать для вашей конкретной аудитории.

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

npx browserslist "> 10%, last 3 versions"

Это дает вам список последних 3 версий браузеров, использование которых превышает 10%.

Как только вы выяснили, какие запросы списков браузеров работают для вас, чтобы создать большой пакет для максимальной совместимости с браузером и более тонкий для современных браузеров, вы можете использовать ngx_http_browser_module для обслуживания пакетав зависимости от агента пользователя входящего запроса.