前言
在前端开发中，我们经常会使用各种工具和框架来提高效率和代码质量。其中，babel 是一个优秀的工具，能够将 ECMAScript 6 及以上版本的代码转化为 ES5 代码，使得我们在浏览器上能够更好的运行新特性的代码。但是，babel 的默认配置对于一些开发人员来说可能不太适用，这时候就需要使用 babel 的一些 preset 来满足我们的需求，本篇文章介绍一个常用的 npm 包：babel-preset-nodely。
简介
babel-preset-nodely 是一个适用于 babel 的 preset，主要用于转化 ES6 的代码，并添加一些常用的 Polyfill 支持。同时，它也提供了一些 ES7 和 ES8 的支持，使得我们能够使用一些最新的 JavaScript 特性，不用担心兼容性问题。
安装
安装 babel-preset-nodely 很简单，我们只需要在命令行中输入以下命令：
$ npm install --save-dev babel-preset-nodely
使用
安装完成后，我们需要在 babel 配置文件中添加 "nodely" preset。例如，在 .babelrc 文件中添加：
{
"presets": ["nodely"]
}这时候，babel 在编译代码时就会自动使用这个 preset，将 ES6 代码转换为 ES5 代码，并添加一些常用的 Polyfill。
配置
如果我们想要添加自己的配置，比如指定需要转换的浏览器，或者关闭某个特性的转换等，可以在 babel 配置文件中进行设置。例如，添加浏览器列表的配置，可以在 .babelrc 文件中添加：
-- -------------------- ---- -------
-
---------- -
---------- -
---------- -
----------- ------ - ---------- ------- -- ---
-
--
-
-这里我们将浏览器列表指定为 "last 2 versions" 和 "safari >= 7"，表示我们需要支持的浏览器是最近 2 个主要版本和 Safari 7 及以上版本。
示例代码
下面是一个简单的示例代码，展示了如何使用 babel-preset-nodely 将 ES6 代码转换为 ES5 代码：
-- -------------------- ---- -------
-- -- - --
----- ------ -
----------------- -
--------- - -----
-
---------- -
------------------- -- ---- -- ---------------
-
-
-- --- --
---- --------
-------- ------------------------- ------------ - -- ----------- ---------- ------------- - ----- --- ----------------- ---- - ----- -- - ----------- - -
--- ------ - -------- ------------ -
--------------------- --------
--------- - -----
--
------------------------- - -------- -- -
------------------- -- ---- -- - - -----------
--可以看到，使用了 babel-preset-nodely 后，我们的 ES6 代码被成功转换为了 ES5 代码，同时还添加了必要的 Polyfill。
总结
本篇文章介绍了 npm 包 babel-preset-nodely 的基本用法和配置方法，希望对前端开发人员有一定帮助。同时，我们也需要注意，preset 只是一个工具，我们需要结合实际需求，选择合适的 preset，并加以配置，使得我们的代码更好的运行和维护。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/60067357890c4f7277583d00