Babel
記住官網鏈接babeljs.io
Docs
General
Presets
env
options
useBuiltIns
看stackoverflow上關於對這個usage和entry用法的解釋,使用usage的話,自己不需要添加import
"usage"
| "entry"
| false
, defaults to false
This options configures how @babel/preset-env
handles polyfills
when either the usage
or entry
options are used, @babel/preset-env
will add direct reference to core-js
modules as bare imports (or requires). This means core-js
will be resolved relative to the file itself and needs to be accessible.
since @babel/polyfill
was deprecated in 7.4.0, we recommend directly adding core-js
and setting the version via the corejs
option.
usage
或entry
被使用的時候,@babel/preset-env
會添加直接的引用給core-js
模塊作爲赤裸裸的imports或是requires。就是說core-js
會相對於這個文件自身而被解析,並且需要能被訪問。直接添加
core-js
並且通過corejs
選項設置版本
注意,webpack中的這個選項
options: {
presets: ["@babel/preset/env"]
}
和.babelrc文件有衝突。 如果兩個都使用了的話,通過我的測試,.babelrc裏的很多選項都是想了,比如useBuiltIns, 可以通過修改名字來判斷,即沒有報錯說明根本沒用到這個選項。
此外,直接這在webpack裏這樣設置的話,並且沒有使用Import的話,那麼babel基本上沒用上core-js。
那到底在webpack的babel-loader中怎麼配置這個Options呢,這個就要看babel的教程了,就在Docs - Usage - Options
裏面。比如裏面就提到哪些選項可以被用在babel的整合用戶中,就像babel-loader這樣的用戶。能用的經測試,babelrc配置boolean,可以決定webpack是不是用.babelrc,經測試如果false那麼基本上core-js沒用上了。
useBuiltIns: 'entry'
This option enables a new plugin that replaces the import “core-js/stable”; and import “regenerator-runtime/runtime” statements (or require(“corejs”) and require(“regenerator-runtime/runtime”)) with individual requires to different core-js entry points based on environment.
這個選項會開啓一個新的插件,這個插件會使用,獨立的requires不同的基於環境的入口點,來代替上面提到的這些import或require。
Importing
"core-js"
loads polyfills for every possible ECMAScript feature: what if you know that you only need some of them? When usingcore-js@3
,@babel/preset-env
is able to optimize every singlecore-js
entrypoint and their combinations. For example, you might want to only polyfill array methods and newMath
proposals:
導入core-js
爲每一個可能的ECMAScript特色加載polyfills。
這麼說我是不是可以理解爲,如果只使用
import 'core-js'
,,那麼會加載所有的polyfills,即使某些polyfills不需要呢?
看到這裏可以去看一下core-js在github的repository
useBuiltIns: 'usage'