babel preset env что это
We’re super 😸 excited that you’re trying to use ES2015 syntax, but instead of continuing yearly presets, the team recommends using babel-preset-env. By default, it has the same behavior as previous presets to compile ES2015+ to ES5. Please check out the v1.x readme for more info. (For Babel 7, we have moved the preset into the main babel repo.
If you are using Babel version 7 you will need to run npm install @babel/preset-env and have «presets»: [«@babel/preset-env»] in your configuration.
Before you do anything
You might end up on this page because you saw a message in the terminal like this:
🙌 Thanks for using Babel: we recommend using babel-preset-env now: please read babeljs.io/env to update!
If you don’t use Babel or don’t use deprecated yearly presets, you probably saw this message because another package you depend on uses them. In that case there’s nothing you need to do. Nevertheless, it might be a good idea to find out which package uses the deprecated presets, and help them migrate by sending a pull request. You can find this out by running npm ls babel-preset-es2015 which will show the dependency tree.
Upgrading to babel-preset-env
options change with preset options
babel-preset-env is a new preset, first released over a year ago that replaces many presets that were previously used including:
By targeting specific browsers, Babel can do less work so you can ship native ES2015+ 😎!
options against a specific chrome version
options against current node version
Some history on babel-preset-env
Can check the preset-env docs for more information and further docs.
Babel preset env что это
Now that babel-preset-env has stabilized, it has been moved into the main Babel mono-repo and this repo has been archived.
The move makes it much easier to release and develop in sync with the rest of Babel!
This repo will be made read-only, as all of the issues/labels have been moved over as well. Please report any bugs and open pull requests over on the main mono-repo.
A Babel preset that compiles ES2015+ down to ES5 by automatically determining the Babel plugins and polyfills you need based on your targeted browser or runtime environments.
Without any configuration options, babel-preset-env behaves exactly the same as babel-preset-latest (or babel-preset-es2015, babel-preset-es2016, and babel-preset-es2017 together).
However, we don’t recommend using preset-env this way because it doesn’t take advantage of it’s greater capabilities of targeting specific browsers.
You can also configure it to only include the polyfills and transforms needed for the browsers you support. Compiling only what’s needed can make your bundles smaller and your life easier.
This example only includes the polyfills and code transforms needed for coverage of users > 0.25%, ignoring Internet Explorer 11 and Opera Mini.. We use browserslist to parse this information, so you can use any valid query format supported by browserslist.
You can also target individual versions of browsers instead of using a query with «targets»: < "chrome": "52" >.
Similarly, if you’re targeting Node.js instead of the browser, you can configure babel-preset-env to only include the polyfills and transforms necessary for a particular version:
For convenience, you can use «node»: «current» to only include the necessary polyfills and transforms for the Node.js version that you use to run Babel:
Check out the many options (especially useBuiltIns to polyfill less)!
Determine environment support for ECMAScript features
Use external data such as compat-table to determine browser support. (We should create PRs there when necessary)
We can periodically run build-data.js which generates plugins.json.
Maintain a mapping between JavaScript features and Babel plugins
This should be straightforward to do in most cases. There might be cases where plugins should be split up more or certain plugins aren’t standalone enough (or impossible to do).
Support all plugins in Babel that are considered latest
It won’t include stage-x plugins. env will support all plugins in what we consider the latest version of JavaScript (by matching what we do in babel-preset-latest ).
Determine the lowest common denominator of plugins to be included in the preset
If you are targeting IE 8 and Chrome 55 it will include all plugins required by IE 8 since you would need to support both still.
Support a target option «node»: «current» to compile for the currently running node version.
For example, if you are building on Node 6, arrow functions won’t be converted, but they will if you build on Node 0.12.
Support a browsers option like autoprefixer
Почему вы можете обойтись без Babel
Также приглашаем всех желающих на открытый вебинар «Код как проект — настройка окружения для разработки на JavaScript». На вебинаре участники вместе с экспертом рассмотрят основные инструменты, которые помогают делать код лучше и чище — prettier, eslint, husky.
В наше время фронтенд-разработчики все еще тратят много времени на чрезмерную подготовку и настройку программного обеспечения. Babel воспринимается некоторыми как вынужденная необходимость, но я намерен показать вам, что это не так.
Ознакомившись с этой статьей, вы поймете:
как выяснить, какие браузеры действительно требуют дополнительной поддержки в каждом конкретном случае.
как использовать редактор Visual Studio Code, чтобы обойтись без Babel.
существует другая альтернатива программного обеспечения, чтобы сделать ту же работу быстрее.
Что такое Babel и какую проблему он решает?
Babel — это компилятор, который преобразует ваш современный JavaScript для запуска в старых браузерах. Он также может выполнять и другие задачи, такие как преобразование синтаксиса JSX, но это не единственный инструмент для этого.
По мере развития браузеров добавляются новые функции API и ECMAScript. Различные браузеры развиваются с разной скоростью и расставляют акценты в качестве приоритетных для разных задач. Это ставит нас перед непростым выбором: как мы можем их все поддерживать и при этом использовать современные функции? Некоторые из них будут несовместимы.
Обычное решение заключается в том, чтобы использовать новейшие возможности и трансформировать их в более старый код, который будет понятен браузеру. Транспилирование (Transpiling — сочетание двух слов: transforming — преобразование и compiling — компиляция) описывает специализированный тип компиляции. Она имеет различные значения в разных контекстах. В нашем случае также существуют две отдельные составляющие для переноса (транспилирования).
Разница между транспилированием (transpiling) и полифилингом (polyfilling)
Транспилирование (Transpiling) — это процесс преобразования синтаксиса нового языка, который старые браузеры не могут понять, в старый синтаксис, который они распознают.
Приведем пример переноса оператора let :
Полифилинг (Polyfilling) — это процесс добавления недостающих методов, свойств или API к старым браузерам путем предоставления собственной версии недостающего родного кода.
Это можно рассматривать как дополнение недостающих элементов. Например, вот полифил (polyfill) для isNaN :
Наилучшим способом для получения полифилов является использование core-js.
Транспилирование и полифилинг иногда невозможны и могут значительно увеличить объем кода, лучше всего их вообще избегать, если это возможно. Поэтому альтернатива, которую мы будем рассматривать в первую очередь, является наиболее оптимальным решением.
Альтернатива №1: не поддерживать древние браузеры
Если бы пользователи просто обновили свои браузеры, мы могли бы избежать хлопот, связанных с транспилированием, и они могли бы наслаждаться усовершенствованными функциями и производительностью нового браузера. К сожалению, все не так просто.
Главный виновник — крупные корпорации, которым приходится поддерживать старое программное обеспечение. Классическим примером является Internet Explorer, который с самого начала был помехой для веб-разработок.
Тем не менее, за последние годы многое изменилось в лучшую сторону. Теперь большинство существующих браузеров актуальны, то есть они постоянно обновляются. Microsoft продвигает свой современный браузер Edge, который, что удобно, использует тот же движок V8, как и Chrome, что означает сокращение количества поддерживаемых движков на один.
Чтобы определить, нужно ли поддерживать определенный браузер, задайте себе следующие вопросы.
1. Какие браузеры в настоящее время используют Ваши клиенты?
Если у вас уже есть веб-сайт или приложение, которое обслуживает одну и ту же клиентскую базу, вы можете получить эту информацию из программы аналитики. Ниже приведены некоторые последние статистические данные с британского сайта звуковой инженерии, которым я управляю. Если бы это было JavaScript-приложение с теми же клиентами из той же категории, я бы предположил, что они будут использовать те же браузеры.
Если у вас не установлено аналитическое программное обеспечение, вы не будете знать, какие браузеры вам нужно поддерживать. Вы должны будете сделать обоснованное предположение. Если у вас есть корпоративные клиенты, гораздо больше шансов, что вам понадобится поддержка IE11 (Internet Explorer 11), чем если бы вы занимались маркетингом для фанатов web-literate (грамотное программирование) технологий.
Когда вы поддерживаете браузер, то принимаете на себя обязательства. Вы действительно хотите иметь лишние тесты в каждом выпуске, дополнительные инструменты для настройки и больше различных функций, чтобы это обслуживать?
Должна быть ясная финансовая причина, чтобы пойти на все эти хлопоты. Будет ли потеря тех клиентов, которые не могут получить доступ к вашему сайту или приложению, стоить дороже, чем поддержка браузера?
2. Какие современные функции браузера вы хотите использовать?
Использование современных функций языка и API (Application Programming Interfaces) браузера делает написание кода проще, быстрее и интереснее. Это также делает ваш код более удобным в обслуживании.
3. Какие современные функции браузера поддерживают браузеры ваших клиентов?
Эти данные доступны через Can I use (могу ли я использовать), но это напрасная трата времени на их поиск вручную. Теперь, когда вы знаете названия браузеров, которые вы хотите поддерживать, поиск совместимых функций может быть автоматизирован с помощью удивительного приложения Browserlist (подробнее об этом в следующем разделе).
Альтернатива № 2: Используйте eslint-plugin-compat
Вы можете вообще избежать всего процесса переноса (transpiling) и вместо этого позволить вашему редактору кода предупредить вас, если вы используете какие-либо функции, которые слишком сложны для браузеров ваших клиентов. Это самый простой вариант, потому что он:
исключает любую зависимость от транспилиров (transpilers). Возвращает вам практический контроль над рабочим кодом.
если имеется современная функция, без которой вы не можете жить, то ее можно использовать применив полифил (polyfill).
В противном случае, вы можете просто использовать старый синтаксис, когда это необходимо.
Создать тест
Прежде чем мы сможем разобраться в плюсах и минусах, надо убедиться, что наши альтернативы Babel могут выполнять ту же самую основную работу. Давайте сделаем небольшой тест.
Ниже приведен современный код, который должна поддерживать наша целевая среда после переноса (transpiled).
После переноса (transportation) для каждой функции есть console.assert (метод записи сообщений на консоли для пользователя), чтобы убедиться, что она работает, как положено. В случае eslint-plugin-compat вместо этого проверим, что несовместимый код помечен в linting (Linting — это процесс, выполняемый программой linter, которая анализирует исходный код на определенном языке программирования и отмечает потенциальные проблемы, такие как синтаксические ошибки, отклонения от предписанного стиля кодирования или использование конструкций, о которых известно, что они небезопасны).
Использование eslint env свойства с помощью eslint-plugin-compat
Нам нужен обходной путь для объединения функций языка и API браузера.
Полную инструкцию можно найти в eslint-plugin-compat repo. Мы воспользуемся browserlist defaults как предустановками по умолчанию. Замените их по своему выбору, основанному на аналитике.
Что такое browserlist?
Browserlist автоматически выбирает список браузеров, основываясь на различных критериях, которые Вы ему предоставляете.
defaults — использует быстрый доступ к таким версиям браузеров:
> 0,5 процента (версии браузеров, выбранные по глобальной статистике использования)
Последние две версии (каждого «живого (not dead)» браузера)
Firefox ESR (Extended Support Release)
“Живые (not dead)” (браузеры без официальной поддержки и обновлений в течение 24 месяцев).
Перейдите на GitHub, чтобы получить полный список запросов, доступных для выбора поддерживаемых браузеров.
Настройка eslint-plugin-compat для Visual Studio Code
Добавьте следующие пакеты в свой проект.
Было бы неплохо, если бы eslint-plugin-compat автоматически добавил и возможности языка, но на данный момент это является нерешённой задачей.
IE 11 с выбранной настройкой —
— наш API fetch() помечен.
Альтернатива № 3: Используйте другое программное обеспечение для замены Babel
Прежде чем рассматривать альтернативы, давайте быстро рассмотрим, как использовать Babel.
Использование Babel для транспилирования (transpile) и полифилинга (polyfill)
Сначала создайте директорию мини-проекта и установите нужные нам взаимосвязи.
Наконец, запустите файл, чтобы проверить, что тесты все еще работают.
Вот результирующий транспилированный (transpiled) код. Обратите внимание на весь лишний мусор и хлам.
Преимущества и недостатки использования Babel
Эта базовая установка была относительно несложной.
У Babel есть большое сообщество для поддержки и постоянных обновлений с 36.8k GitHub звездами на момент написания статьи.
Медленное время компиляции
Множество зависимостей (dependencies), даже если они являются зависимостями (dev-dependencies). (установлено 269 пакетов)
Использование swc для транспилирования (transpile) и полифилинга (polyfill)
Swc — новый конкурент Babel. Он написан на языке программирования Rust и в 20 раз быстрее. Это может быть очень важно, если вы долго ждете, чтобы построить свой проект.
Чтобы все устроить:
Запустите полученный файл, чтобы проверить, что тесты все еще работают.
В итоге swc-transpiled (транспилированный) файл, выглядит вот так:
Преимущества и недостатки использования swc
Гораздо меньше зависимостей (установлено 43 пакета)
Не все функции Babel в настоящее время поддерживаются
Меньшая пользовательская база и количество постоянных участников
Другие альтернативы: Google Closure Compiler и TypeScript
Я не включил Google Closure Compiler в качестве опции, потому что он, как это ни печально, сложен в использовании. Тем не менее, он может сделать хорошую работу по транспилированию (transpile) и полифилингу (polyfill). Если у вас есть свободное время, я рекомендую вам проверить его — особенно если вы цените небольшой размер файла, так как встроенная функция минификации демонстрирует отличные результаты.
Вы также можете использовать TypeScript для переноса (transpile) и core-js для ручной полифил (polyfill) обработки, но это неуклюжее решение, которое может с легкостью создать больше проблем, чем решить их.
Заключение
Вам не нужно автоматически поддерживать старые браузеры. Важно сначала взглянуть на свои аналитические данные, чтобы увидеть, какие браузеры на самом деле используют ваши клиенты.
При необходимости Вы можете использовать функцию linting, чтобы убедиться в их совместимости друг с другом. Это избавит Вас от лишних хлопот, связанных с созданием специального сборочного процесса и транспиляции (transpilation).
Если вы выберете автоматический перевод, то SWC будет намного быстрее, чем Babel, и будет содержать гораздо меньше зависимостей. Также есть возможность использовать Google Closure Compiler или TypeScript, но для их настройки потребуется немного больше усилий.
LogRocket: Полная видимость ваших веб-приложений
LogRocket — это передовое решение для мониторинга приложений, позволяющее воспроизводить проблемы так, как если бы они возникали в вашем собственном браузере. Вместо того, чтобы гадать, почему происходят ошибки, или спрашивать пользователей на скриншотах и дампах логов, LogRocket позволяет воспроизводить сеанс, чтобы быстро понять, что пошло не так. Он отлично работает с любым приложением, независимо от фреймворка, и имеет плагины для записи дополнительного контекста из Redux, Vuex и @ngrx/store.
В дополнение к регистрации действий и состояния Redux, LogRocket записывает журналы консольных сообщений, ошибки JavaScript, следы стеков, сетевые запросы/ответы в формате заголовок + тело, метаданные браузера и пользовательские журналы. Кроме того при помощи DOM (Document Object Model) позволяет записывать страницы HTML и CSS, воссоздавая превосходные в пиксельном отношении видео даже для самых сложных одностраничных приложений.
Смотреть открытый вебинар «Код как проект — настройка окружения для разработки на JavaScript».
Как с нуля создать проект на React, используя Webpack 4 и Babel
Oct 17, 2018 · 5 min read
Недавно я начал изучать React и для создания проектов я использовал create-react-app, чтобы быстро и без особых усилий добиться желаемого результата. Я подозреваю, что вы тоже используете create-react-app или react-slingshot для создания приложений на React. Ничего не имею против этих инструментов — они хорошо справляются с конфигурацией, в то время как у вас есть возможность сосредоточиться на самом React. Но таким ли способом вы хотите изучить React?
Скорее всего нет, иначе вы бы не читали эту статью.
Начало работы:
Файловая структура:
Вы можете создать указанные выше каталоги с помощью этих команд:
Инициализация проекта:
Все проекты, которые используют nmp, должны быть инициализированы. Для инициализации проекта — введите следующую команду в терминале:
Это создаст файл package.json
Теперь файл package.json будет выглядеть примерно так:
Установка Webpack:
Webpack — это модульный сборщик, который позволяет объединять ресурсы и библиотеки, необходимые для проекта, в один файл. Давайте добавим Webpack в наш проект:
Установка React:
Установим react и react-dom в качестве зависимости.
Установка Babel:
Для того чтобы React работал, необходимо вместе с ним установить Babel. Он поможет в транспайлинге ES6 и JSX в ES5.
Установите babel-core, babel-loader, babel-preset-env, babel-preset-react в качестве зависимости dev.
Index.js :
Создайте файл index.js внутри корневой папки / src папки и добавьте в него следующую строчку кода:
Этот файл будет точкой входа в наше приложение.
Index.html :
Создайте файл index.html внутри корневой папки / src папки и добавьте в него следующий код:
Entry и Output файл:
Создайте webpack.config.js в корневом каталоге проекта, чтобы мы могли определить наши webpack loaders.
Определите точку входа и выходной каталог нашего приложения внутри webpack.config.js
В приведенном выше коде, Webpack объединит все наши JavaScript файлы в файл index_bundle.js внутри каталога /dist.
Webpack Loaders:
Теперь добавьте в этот файл loaders, которые будут ответственны за загрузку и объединение исходных файлов.
Внутри webpack.config.js добавьте следующие строки кода:
Здесь babel-loader используется для загрузки наших JSX/JavaScript файлов, css-loader для загрузки и объединения всех CSS файлов в один, а style-loader добавит все стили внутрь тега документа style.
Прежде чем Webpack сможет использовать css-loader и style-loader, мы должны установить их в качестве зависимости dev:
Имейте в виду, что Webpack выполняет loaders в обратном порядке: с последнего до первого, то есть справа налево.
.babelrc:
Данный файл сообщит babel, какие из пресетов использовать для транспайлинга кода. Здесь мы используем два пресета:
Компиляция файлов с помощью Webpack:
Добавьте следующие строки кода в объект script файла package.json, как показано ниже:
Здесь я воспользовался флажком watch, поэтому всякий раз, когда происходит изменение исходных файлов, webpack автоматически скомпилирует все исходные файлы.
Теперь вы можете скомпилировать проект, воспользовавшись следующей командой:
App.js
App.css:
Данный CSS файл используется, чтобы убедиться, что css-loader и style-loader работают корректно.
Измените файл index.js, который мы создали ранее, добавив следующие строки кода:
Установка Html-webpack-plugin:
Теперь нам нужно установить html-webpack-plugin. Этот плагин генерирует HTML файл, затем вставляет в него скрипт и записывает файл на dist/index.html.
Установите html-webpack-plugin, в качестве зависимости dev:
Теперь нам нужно настроить этот плагин внутри файла webpack.config.js, добавив в него следующий код:
В каталоге /dist мы создаем файл шаблона index.html с введенным скриптом.
Установка почти завершена, осталось скомпилировать исходные файлы с помощью webpack. Вы можете запустить проект, используя следующую команду:
Вы получите выходные данные внутри каталога /dist. Откройте index.html в браузере и вы увидите текст “My React App!”.
У этого подхода есть один недостаток: вам нужно каждый раз вручную обновлять веб-страницу, чтобы увидеть сделанные вами изменения. Чтобы webpack обновлял веб-страницу всякий раз, когда какие-либо изменения вступают в силу, мы можем установить webpack-dev-server.
Установка Webpack-dev-server:
Установите webpack-dev-server, в качестве зависимости dev:
И измените скрипт start в файле package.json, как показано ниже:
Выполните следующую команду в терминале:
Вы должны увидеть окно браузера, в котором будет точно такое же содержимое, как на следующем скриншоте:
Вот и все, теперь у нас есть собственный boilerplate (шаблон) React, который мы можем использовать для создания наших проектов на React. Также вы можете скачать данный шаблон с моего Github.
Русские Блоги
Использование @ babel / preset-env и @ babel / plugin-transform-runtime и различия сценариев
Если мы ничего не делаем и не пишем параметры и конфигурации для babel, тогда babel не обладает такой мощностью и ничего не может делать. Именно благодаря гибкой комбинации и расширению возможностей различных предустановленных плагинов Babel полон очарования. сотворить чудо
@babel/preset-env
Это очень часто используемый пресет. Практически все руководства и платформы позволяют настроить его. Он отображается вместо preset-es20** С серией предустановок babel вам больше не нужны сложные конфигурации совместимости. Добавлять по одному для каждого нового предложения? Это глупо.
С его помощью у нас может быть все, и! Он также может загружать нужные нам полифилы по запросу. Это так волшебно.
Но это не так автоматично. Если вы не знаете, как его настроить, вы, вероятно, не воспользуетесь им.
Независимо от того, как вы его поднимаете, сначала попробуйте, увидеть, значит верить
Затем я собираю его (здесь я использую разборку)
Посмотрите на результат 
Мы видим, что Babel помог нам в этом:
Странно, а почему babel не помогает нам преобразовать карту? И обещания тоже есть в es6
это хорошо. А теперь опять упакуем. 
Эй, эффекта нет. Как и раньше. Объясните, что это не проблема с настройкой целевого браузера, но babel не может этого сделать.
Потому что по умолчанию @ babel / preset-env преобразует только синтаксис, который является стрелочной функцией и const, которые мы видим.
Если вам нужно дополнительно преобразовать встроенные объекты и методы экземпляра, вы должны использовать polyfill, что требует небольшой настройки.
Существует важный параметр useBuiltIns, который является ядром, контролирующим, как @ babel / preset-env помогает нам импортировать полифил. У него есть три значения на выбор.
entry
Это метод импорта записи, если мы пишем в записи конфигурации пакета или записи файла import «core-js» С такой строкой кода babel представит нам необходимый полифилл на основе текущих браузеров (списка браузеров), которые вы настроили.
Вот так, давайте попробуем это в файле index.js core-js
Babel настроен следующим образом
Что насчет после упаковки? 
Это ужасно, бабель нас наполняет import «core-js» Вместо этого я импортировал большой полифилл, и все это я не использовал.
На данный момент полифилла, вводимого после упаковки, очевидно, намного меньше. 
Но то же самое мы не использовали.
Это также подтверждает сказанное выше. Когда значение useBuiltIns равно entry, @ babel / preset-env будет импортировать необходимые элементы на входе в соответствии с заданным вами целевым браузером. Полифилл,
Нужна она вам или нет.
Таким образом, мы можем узнать, что преимущество useBuiltIns = entry заключается в том, что зона покрытия относительно велика, и это можно сделать в одном мозгу, но недостатком является то, что набранный пакет намного больше, и есть много неиспользуемых полифиллов, и это также будет загрязнять общий
useage
Это более волшебно, когда useBuiltIns = useage, он будет ссылаться на целевой браузер (список браузеров) и функции, используемые в коде, для добавления полифиллов по мере необходимости.
Конечно, используя useBuiltIns = useage, вам также необходимо указать номер версии другого параметра corejs,
core-js поддерживает две версии, 2 или 3. Многие новые функции больше не будут добавлены в 2, например: flat и последние методы, 2 недоступны в этой версии, поэтому я предлагаю вам использовать 3.
.Browserslistrc в это время
После упаковки: 
хорошо, достаточно удивительно, все новые функции, которые мы используем, действительно добавлены
Объем пакета таким образом невелик, но если мы исключим каталог node_modules / и встретим сторонний пакет, который не был переведен, синтаксис ‘hello’.includes (‘ h ‘) в стороннем пакете не будет обнаружен. Мы столкнемся с ошибками
false
Последним является useBuiltIns = false, это просто, это также значение по умолчанию, не вводите полифил при использовании этого значения
@babel/runtime
Этот метод будет использовать вспомогательную функцию для достижения совместимости функций,
А использование подключаемого модуля @ babel / plugin-transform-runtime также может предотвратить загрязнение всего мира с помощью прокладок песочницы и удалить общедоступную вспомогательную функцию для сохранения избыточности кода.
Плагин @ babel / plugin-transform-runtime также имеет параметр corejs, который необходимо заполнить
Версия 2 не поддерживает встроенные объекты, но начиная с Babel 7.4.0, у нас есть @ babel / runtime-corejs3, мы можем использовать corejs: 3 для поддержки методов экземпляра
После упаковки следующим образом: 
Мы видим, что код, скомпилированный с помощью @ babel / plugin-transform-runtime, сильно отличается от предыдущей компиляции @ babel / preset-env.
Он использует вспомогательную функцию и получает псевдоним, извлеченный как открытый метод, для повторного использования. Например, он использует _Promise вместо new Promise, чтобы избежать создания глобальных объектов.
Что произойдет, если два вышеуказанных метода используются вместе
использование и @ babel / время выполнения
Это умнее, когда useage и @ babel / runtime используются одновременно, и не создает дублирующих полифилов.
Причина для личного анализа должна быть следующей: плагин babel выполняется до prset, поэтому preset-env получает код, завернутый в @ babel / runtime с помощью вспомогательной функции, а его использование заключается в том, чтобы определить, какие новые функции использует код для оценки, поэтому требуется То, что вы получаете, это просто набор вспомогательных функций, естественно без эффекта
Процесс эксперимента следующий:
Результат упаковки: 
запись и @ babel / время выполнения
В отличие от useage, в режиме ввода, после обработки @ babel / runtime, есть не только различные вспомогательные функции, но и множество полифилов, которые будут безжалостно увеличивать объем упаковки
Персональный анализ: обнаружен в режиме входа import «core-js» И сразу заменяется всеми полифилами, необходимыми для текущего целевого браузера, поэтому он не конфликтует с @ babel / runtime, что приводит к проблеме повторного введения кода, поэтому эти два метода нельзя использовать вместе. Второй вариант Только один
Процесс внедрения выглядит следующим образом:
подводить итоги
Вы можете выбрать один из двух методов выше 1, 2, и его бессмысленно использовать одновременно, и это может привести к дублированию файлов полифилов.
Интеллектуальная рекомендация
Замена персонажа
Базовые знания Python3: List
Просто поймите: 1. Типы элементов в списке могут быть разными, он поддерживает числа, строки и даже списки (так называемая вложенность). 2. Список представляет собой список элементов, заключенн.
NOIP 2017 Улучшенное сокровище группы ___ государственное давление dp + dfs
HYSBZ-2002: Bounce Bouncing Sheep (алгоритм блокировки)
Отскок летающей овцы Однажды Лостмонки изобрел сверхэластичное устройство и, чтобы похвастаться перед своими друзьями-овцами, пригласил маленькую овечку поиграть в игру. В начале игры Lostmonkey разме.