builtins自定义_关于@babel/preset-env以及useBuiltIns配置项

以最新版本 7.5.0为准

安装

npm install --save-dev @babel/core @babel/cli @babel/preset-env

npm install --save @babel/polyfill

运行时依赖安装

@babel/polyfill 模块包括 core-js 和一个自定义的 regenerator runtime 模块

npm install --save @babel/polyfill

这个@babel/preset-env套餐几乎能做一切事情，包括处理 polyfills：

this option configures how @babel/preset-env handles polyfills.

useBuiltIns: 'entry'

NOTE: Only use require("@babel/polyfill"); once in your whole app. Multiple imports or requires of @babel/polyfill will throw an error since it can cause global collisions and other issues that are hard to trace. We recommend creating a single entry file that only contains the require statement.

This option enables a new plugin that replaces the statement import "@babel/polyfill" or require("@babel/polyfill") with individual requires for @babel/polyfill based on environment.

npm install @babel/polyfill --save

Copy

In

import "@babel/polyfill";

Copy

Out (different based on environment)

import "core-js/modules/es7.string.pad-start";

import "core-js/modules/es7.string.pad-end";

Copy

This will also work for core-js directly (import "core-js"; or require('core-js');)

useBuiltIns 的 usage选项 转换前

var b = new Map();

转换后

import "core-js/modules/es.array.iterator";

import "core-js/modules/es.map";

import "core-js/modules/es.object.to-string";

import "core-js/modules/es.string.iterator";

import "core-js/modules/web.dom-collections.iterator";

var b = new Map();

useBuiltIns 的 entry选项,则不一样了，需要在src源码手动引入，转换后只不过是打散了，这个有何用呢

转换前

import "core-js/es/array";

import "core-js/proposals/math-extensions";

var b = new Map();

转换后

import "core-js/modules/es.array.concat";

import "core-js/modules/es.array.copy-within";

import "core-js/modules/es.array.every";

import "core-js/modules/es.array.fill";

import "core-js/modules/es.array.filter";

import "core-js/modules/es.array.find";

import "core-js/modules/es.array.find-index";

import "core-js/modules/es.array.flat";

import "core-js/modules/es.array.flat-map";

import "core-js/modules/es.array.for-each";

import "core-js/modules/es.array.from";

import "core-js/modules/es.array.includes";

import "core-js/modules/es.array.index-of";

import "core-js/modules/es.array.is-array";

import "core-js/modules/es.array.iterator";

import "core-js/modules/es.array.join";

import "core-js/modules/es.array.last-index-of";

import "core-js/modules/es.array.map";

import "core-js/modules/es.array.of";

import "core-js/modules/es.array.reduce";

import "core-js/modules/es.array.reduce-right";

import "core-js/modules/es.array.reverse";

import "core-js/modules/es.array.slice";

import "core-js/modules/es.array.some";

import "core-js/modules/es.array.sort";

import "core-js/modules/es.array.species";

import "core-js/modules/es.array.splice";

import "core-js/modules/es.array.unscopables.flat";

import "core-js/modules/es.array.unscopables.flat-map";

import "core-js/modules/es.string.iterator";

import "core-js/modules/esnext.math.clamp";

import "core-js/modules/esnext.math.deg-per-rad";

import "core-js/modules/esnext.math.degrees";

import "core-js/modules/esnext.math.fscale";

import "core-js/modules/esnext.math.rad-per-deg";

import "core-js/modules/esnext.math.radians";

import "core-js/modules/esnext.math.scale";

var b = new Map();

这么鸡肋的功能。。 或者是我理解错了，没有用对？

附带：

babel不同的版本差别比较大，插件不能混用，最新版的presets 还得写成 "@babel/env" 而不是 "env"