在前端开发中，使用 ES6 的语法已经成为了标配，但是有一些 ES6 中提供的函数或语法在一些老旧的浏览器中不支持，需要使用 Polyfill 或是手动实现，这些实现方式往往会让我们的代码变得冗长并且难以维护。这时候，就需要使用 babel-plugin-transform-builtins 这个 npm 包来帮助我们解决这个问题。
安装
首先，在项目中安装 babel-plugin-transform-builtins：
npm install --save-dev babel-plugin-transform-builtins
安装完成后，将该插件配置在 .babelrc 或者 babel.config.js 中：
-- -------------------- ---- -------
-- --------
-
---------- -
--------------------
-
---------------------
-
------------ -
-------------
---------------
-
-
-
-
-使用
在项目中使用需要 Polyfill 的 ES6 函数或语法时，只需要在代码中使用即可，babel-plugin-transform-builtins 会自动将其转换为 ES5 语法，并且自动添加所需的 Polyfill。
以下是一个示例代码：
const arr = Array.from('hello');
const obj = Object.assign({}, {a: 1}, {b: 2});
console.log(arr); // ['h', 'e', 'l', 'l', 'o']
console.log(obj); // {a: 1, b: 2}在上面的代码中，Array.from 和 Object.assign 都是 ES6 中的语法，但是在老旧浏览器中不支持，因此需要使用 babel-plugin-transform-builtins 对其进行转换，并自动添加所需的 Polyfill。
指导意义
babel-plugin-transform-builtins 的使用可以帮助我们更加高效地开发前端应用，并且避免了在老旧浏览器中出现语法不支持的问题，使我们的代码更加健壮且易于维护。同时，在使用该插件时需要注意的是，需要根据实际使用情况来配置所需的 Polyfill，以减少不必要的代码冗余。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/69389