简介
@adhawk/babel-preset 是一个用于 Babel 的预设包，它可以帮助开发者在项目中使用最新的 JavaScript 语法特性，同时支持一些常见的转换。通过使用该预设包，开发者可以避免手动配置 Babel，从而提高开发效率。
安装
在使用@adhawk/babel-preset 之前，你需要安装 npm 包管理工具。如果你已经有了 npm，可以通过以下命令来安装该预设包：
npm install --save-dev @adhawk/babel-preset
这里我们使用 --save-dev 参数来将该包添加到开发依赖中。
配置
安装成功后，你需要在项目中的 .babelrc 文件中添加以下配置：
{ "presets": ["@adhawk/babel-preset"] }
这里使用 presets 关键字来指定预设包，值为 @adhawk/babel-preset。
配置项
@adhawk/babel-preset 提供了一些可选的配置项，以便根据项目需求进行自定义配置。
useBuiltIns
是否启用 @babel/polyfill，用于兼容不支持 ECMAScript 新特性的浏览器环境。设置为 true，则默认开启所有的推荐特性，设置为 false 则禁用所有的特性。设置为 "usage" 则自动根据代码中所需特性按需加载。
以下是 .babelrc 文件中的配置示例：
-- -------------------- ---- ------- - ---------- - - ----------------------- - -------------- ------- - - - -展开代码
targets
用于指定编译的目标浏览器环境。该项值的格式与 @babel/preset-env 相同。下面是一些常见的用法：
"last 2 versions"：最近 2 个版本的浏览器。"ie >= 8"：Internet Explorer 版本大于等于 8。"safari >= 7"：Safari 版本大于等于 7。"chrome >= 31"：Chrome 版本大于等于 31。
以下是 .babelrc 文件中的配置示例：
-- -------------------- ---- ------- - ---------- - - ----------------------- - ---------- - --------- --- ----- -- - - - - -展开代码
transformRuntime
是否启用基于 @babel/plugin-transform-runtime 的运行时转换。如果启用，支持使用内置的运行时库来替换全局常量和内置方法。该项值默认为 false。
以下是 .babelrc 文件中的配置示例：
-- -------------------- ---- ------- - ---------- - - ----------------------- - ------------------- ---- - - - -展开代码
总结
@adhawk/babel-preset 可以帮助开发者在项目中快速使用最新的 JavaScript 语法特性。本文介绍了该包的安装、基础配置和可选配置项。在开发过程中，建议根据项目需求进行自定义配置，以提高开发效率。
示例代码
// 使用箭头函数 const array = [1, 2, 3]; const square = x => x * x; const squares = array.map(square); console.log(squares); // [1, 4, 9]
// 使用 const、let 关键字 const name = 'Tom'; let age = 18; age++; console.log(`My name is ${name}, and I am ${age} years old.`); // My name is Tom, and I am 19 years old.
// 使用对象字面量简写 const name = 'Tom'; const age = 18; const user = { name, age }; console.log(user); // {name: "Tom", age: 18}
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/105930
