共计 1283 个字符,预计需要花费 4 分钟才能阅读完成。
corejs3 的更新
-
前文是 core-js@2 的配置,而 core-js@3 的更新,带来了新的变化,@babel/polyfill 无法提供 core-js@2 向 core-js@3 过渡,所以现在有新的方案去替代 @babel/polyfill,(需要 Babel 版本升级到 7.4.0 及以上),详细可以阅读官方的几篇文档:
- 作者的官方阐述
- Babel 7.4.0 版本的更新内容,及官方的升级建议
- core-js@2 向 core-js@3 升级,官方的 Pull request
- @babel/preset-env 也因 core-js@3 的原因,需要配置 corejs 参数,否则 webpack 运行时会报 warning;
-
@babel/polyfill 不必再安装,转而需要依靠
core-js
和regenerator-runtime
(详细原因请看作者的阐述),替代方案用法如下:-
安装依赖
yarn add babel-loader@8 @babel/core @babel/preset-env -D yarn add core-js regenerator-runtime
-
.babelrc 配置
{ "presets": [ [ "@babel/preset-env", { "modules": false, // 对 ES6 的模块文件不做转化,以便使用 tree shaking、sideEffects 等 "useBuiltIns": "entry", // browserslist 环境不支持的所有垫片都导入 // https://babeljs.io/docs/en/babel-preset-env#usebuiltins // https://github.com/zloirock/core-js/blob/master/docs/2019-03-19-core-js-3-babel-and-a-look-into-the-future.md "corejs": { "version": 3, // 使用 core-js@3 "proposals": true, } } ] ], "plugins": []}
-
js 代码里取代原先的
import '@babel/polyfill'
,做如下修改:import "core-js/stable" import "regenerator-runtime/runtime"
-
-
而 @babel/plugin-transform-runtime,也随着 core-js@3 有更新:
-
安装依赖
yarn add babel-loader@8 @babel/core @babel/preset-env @babel/plugin-transform-runtime -D yarn add @babel/runtime-corejs3
-
.babelrc 文件配置
{ "presets": [ [ "@babel/preset-env", {"modules": false,} ] ], "plugins": [ [ "@babel/plugin-transform-runtime", { "corejs": { "version": 3, "proposals": true }, "useESModules": true } ] ] }
-
正文完