由于@babel/polyfill在Babel7.4之后不再被推荐，@babel/preset-env和plugin-transform-runtime都可以设置corejs来处理polyfill。@babel/polyfill被弃用的主要原因是：这个包只引入了stablecore-js和regenerator-runtime/runtime，后者可以用插件@babel/plugin-transform-regenerator代替。这个包不能从core-js@2顺利过渡到core-js@3。Babel简介简单来说，Babel是一个编译器，主要用于将使用ECMAScript2015+语法编写的代码转换为向后兼容的JavaScript语法，使其可以运行在新旧版本浏览器等各种环境中。Babel代码转换功能是以插件的形式实现的，插件是JavaScript小程序。预设可以被认为是一组配置为可共享模块的Babel插件或选项。插件在预设之前运行；插件从前到后依次执行；presets按照排序顺序倒序执行；babel主要实现了两个功能：转换新语法。用旧版本的语法实现新版本的js语法在相应的环境下运行，比如箭头函数；转换新的API。为老版本runtime打补丁（也叫polyfill），以使用新版本js中定义的，而老版本runtime提供的功能，包括三类：新定义的内置对象，如作为PromiseMethods的原内置对象新添加的static，比如Array.from原内置对象新添加的实例方法，比如Array.prototype.includespreset-envpreset-env可以转换为new语法，也可以通过配置转换为新的API。preset-envpolyfill污染了全局环境。target字段可以填入browserslist的查询字符串。官方推荐使用.browserslistrc文件指定编译目标。该配置文件还可以与autoprefixer和stylelint等工具共享配置。所以不建议在.babelrc的preset-env配置中直接使用targets进行配置。如果需要在这里单独配置targets，在preset-env中指定ignoreBrowserslistConfig为true，忽略.browserslistrc配置项。useBuiltIns是否使用其polyfill功能（全局环境的core-js）。一共有三个值：false：默认值。不要在没有主动引入的情况下使用preset-env实现polyfills，只使用其默认的语法转换功能。如果使用默认值false，应避免在入口文件中引入polyfill，导致打包体积过大。entry：需要在入口处手动引入polyfill。根据浏览器目标环境（targets）的配置，引入不是所有浏览器都支持的polyfill模块，不管项目中是否使用。import"core-js/proposals/string-replace-all"用法：无需在入口文件中手动引入polyfills，Babel会根据代码使用情况自动注入polyfills，这样打包的时候会相对减少打包体积。corejs配置core-js，默认值为“2.0”。此选项仅在与useBuiltIns:usage或useBuiltIns:entry一起使用时有效。core-js：JavaScript的模块化标准库，包括Promise、Symbol、Iterator等诸多特性，让你只加载必要的功能。version:[string]版本号；proposals:[boolean]是否实现提案中的功能；//.babelrc{"presets":[["@babel/preset-env",{"targets":{"chrome":"80"//推荐使用.browserslistrc},"useBuiltIns":"usage","corejs":{"version":3,//版本2和3都需要手动安装库:yarnaddcore-js@3"proposals":false}}}]]]}plugin-transform-runtimeplugin-transform-runtime主要做了三件事：当开发者使用异步或者生成器时，自动引入@babel/runtime/regenerator，开发者不用再输入额外的文件导入；动态引入polyfill，提供沙箱环境，避免全局环境污染；如果直接导入core-js或@babel/polyfill及其提供的内置组件，如Promise、Set、Map等，会污染全局环境。虽然这不会影响应用程序或命令行工具，但如果代码是要分发供其他人使用的库，或者如果您无法精确控制代码运行的环境，则可能会出现问题。所有helpers帮助模块都会引用模块@babel/runtime，避免编译输出重复，减少打包体积；corejs配置值：false、2或{version:number,proposals:boolean}，默认值为false。corejs安装建议falsesenpminstall--save@babel/runtime2npminstall--save@babel/runtime-corejs23npminstall--save@babel/runtime-corejs3helpers配置值boolean类型，默认值为true。是否用对moduleName的调用替换内联Babel帮助程序（classCallCheck、extends等）。regenerator配置值boolean类型，默认值为true。是否将生成器函数转换为使用不污染全局范围的再生器运行时。useESModules配置值为boolean类型，默认值为false。启用后，transform将使用helper而不是@babel/plugin-transform-modules-commonjs。这允许在像webpack这样的模块系统中进行更小的构建，因为它不需要保留commonjs语义。使用场景及实例分析@babel/preset-env和plugin-transform-runtime都可以设置使用corejs来处理polyfills。两者都有使用场景，在项目开发和类库开发时可以使用不同的配置。不要同时为两者配置core-js，以免造成复杂的不良后果。项目开发useBuiltIns使用用法。plugin-transform-runtime仅使用其删除辅助功能以进行内联重用的功能来减小包大小。{“presets”：[[“@babel/preset-env”，{“useBuiltIns”：“usage”，“corejs”：{“version”：3，“proposals”：false}}]]，“plugins”：[["@babel/plugin-transform-runtime",{"corejs":false}]]}类库开发类库开发尽量不要使用污染全局环境的polyfill，所以@babel/preset-env只使用语法transformation函数，polyfill由plugin-transform-runtime处理，推荐使用core-js@3，不要使用没有进入规范的特性。{"presets":["@babel/preset-env"],"plugins":[["@babel/plugin-transform-runtime",{"corejs":{"version":3,"proposals":false},"useESModules":true}]]}打包分析测试代码如下：//syntaxclassPerson{}typeofPersonconstarray=[1,2,3]constfun=()=>{}//apiconsta=Array.isArray([3,5,8])constb=array.map(itm=>itm*2)constp1=Promise.resolve(true)constp2=Promise.reject(false)Promise.allSettled([p1,p2]).then(()=>{console.log('then')}).catch(()=>{console.log('catch')}).finally(()=>{console.log('finally')})通过preset-env配置core-js:"usestrict";var_interopRequireDefault=require("@babel/runtime/helpers/interopRequireDefault");require("core-js/modules/es.array.is-array.js");require("core-js/modules/es.array.map.js");require("core-js/modules/es.object.to-string.js");require("core-js/modules/es.promise.js");require("core-js/modules/es.promise.finally.js");require("core-js/modules/es.array.iterator.js");require("core-js/modules/esnext.promise.all-settled.js");require("核心-js/modules/es.string.iterator.js");require("core-js/modules/web.dom-collections.iterator.js");var_typeof2=_interopRequireDefault(require("@babel/runtime/helpers/typeof"));var_createClass2=_interopRequireDefault(require("@babel/runtime/helpers/createClass"));var_classCallCheck2=_interopRequireDefault(require("@babel/runtime/helpers/classCallCheck"));//语法变量Person=/*#__PURE__*/(0,_createClass2["default"])(functionPerson(){(0,_classCallCheck2["default"])(this,Person);});(0,_typeof2["default"])(Person);vararray=[1,2,3];varfun=functionfun(){};//apivara=Array.isArray([3,5,8]);varb=array.map(function(itm){returnitm*2;});varp1=Promise.resolve(true);varp2=Promise.reject(false);Promise.allSettled([p1,p2]).then(function(){console.log('then');})["catch"](function(){console.log('catch');})["finally"](function(){console.log('finally');});通过plugin-transform-runtime配置core-js:"usestrict";var_interopRequireDefault=require("@babel/runtime-corejs3/helpers/interopRequireDefault");var_isArray=_interopRequireDefault(require("@babel/runtime-corejs3/core-js-stable/array/is-array"));var_map=_interopRequireDefault(require("@babel/runtime-corejs3/core-js-stable/instance/map"));var_promise=_interopRequireDefault(require("@babel/runtime-corejs3/core-js-stable/promise"));var_typeof2=_interopRequireDefault(require("@babel/runtime-corejs3/helpers/typeof"));var_createClass2=_interopRequireDefault(require("@babel/runtime-corejs3/helpers/createClass"));var_classCallCheck2=_interopRequireDefault(require("@babel/runtime-corejs3/helpers/classCallCheck"));//syntaxvarPerson=/*#__PURE__*/(0,_createClass2["default"])(functionPerson(){(0,_classCallCheck2["default"])(this,Person);});(0,_typeof2["default"])(Person);vararray=[1,2,3];varfun=functionfun(){};//apivara=(0,_isArray["default"])([3,5,8]);varb=(0,_map["default"])(array).call(array,function(itm){returnitm*2;});varp1=_promise["default"].resolve(true);varp2=_promise["default"].reject(false);_promise["default"].allSettled([p1,p2]).then(function(){console.log('then');})["catch"](function(){console.log('catch');})["finally"](function(){console.log('finally');});通过打包后代码分析，以preset-env的方式会引入不必要的polyfill，只会以plugin-transform-runtime的方式引入当前页面需要的polyfill
