简介
@schibstedspain/babel-standalone 是一个基于 Babel 的 JavaScript 编译器，支持将 ECMAScript 6+ 代码转译成 ES5 代码。它不依赖于 webpack 或其他构建工具，可以直接在浏览器中使用。这个包支持很多 ECMAScript 6+ 特性的转译，是一个非常好用的 npm 包。
安装
使用 npm 安装：
--- - --------------------------------
使用
基本使用
下面是一个最基本的例子，将 ES6 代码转译为 ES5 代码：
--------- -----
------
------
------------ ---------- ---------------
------- -------------------------------------------------------------------------------------------
-------
------
------- ------------------
----- ----- - --------
------------------- ------------
---------
-------
-------你可以将上面的 HTML 文件在浏览器中打开，然后在控制台中可以看到输出结果：
------ ------
配置选项
@schibstedspain/babel-standalone 还支持很多选项配置，下面是一些常见的配置：
----- ---- - - ----- ----- - -- -- - ------------------ --------- - -- ----- ------- - - -------- ------- -- ----- ------ - --------------------- --------- ------------------------- -- ---- ----------- -------------- -------------------------- -----------
presets
仅通过 Babel 转译代码的话，你需要明确指定要使用哪些转译插件，而 presets 这个选项可以帮助你自动添加一系列的插件。
env 选项是一个非常好用的预设，它会自动根据浏览器的兼容性自动添加转译插件，让你可以使用最新的特性，而不需要担心兼容性问题。
plugins
如果你需要添加一些特定的转译插件，可以使用 plugins 选项。
----- ---- - - ----- - - -- ----- - - --- -- --- ------------- -- --- --------------------------- -- ----- ------- - - -------- ------------------------------------- --------------------------------- -- ----- ------ - --------------------- --------- ------------------------- -- ---- ----------- --------------------------------------------------------------------
sourceMap
如果你需要生成 source map 文件，可以使用 sourceMap 选项。
----- ---- - - ----- ----- - -- -- - ------------------ --------- - -- ----- ------- - - -------- -------- ----------- ---- - ----- ------ - --------------------- --------- ------------------------- -- ---- ----------- -------------- -------------------------- ----------- ----------------------- -- --------- -- ----- ----- -------- ------ --------- ------
总结
上面我们介绍了如何使用 @schibstedspain/babel-standalone，以及如何配置选项。这个 npm 包非常适合那些想在浏览器中编写和运行 ES6+ 代码的开发者使用。如果你对 JavaScript 的转译和构建有更深入的了解，你会发现 @schibstedspain/babel-standalone 是一个非常好用的工具，可以让你在项目中得到更好的使用体验。
来源：JavaScript中文网 ，转载请联系管理员！ 本文地址：https://www.javascriptcn.com/post/600553af81e8991b448d0eca