前言
当我们在开发前端项目的过程中，经常需要将多个 JavaScript 文件打包成一个文件来减少请求次数与提高网页的加载速度。于是，Browserify 工具应运而生。Browserify 可以将 node.js 的代码打包到浏览器运行。而 @rubeniskorg/browserify-transform-tools 是一个轻量级的插件，可以将代码转换为浏览器可读的格式。本文将介绍如何使用这个 npm 包。
安装
可以使用 npm 包管理器来安装 @rubeniskorg/browserify-transform-tools 。在终端中执行以下代码：
npm install @rubeniskorg/browserify-transform-tools --save-dev
同时你需要确保你已经正确安装了 Browserify 工具，如果没有安装可以执行以下命令：
npm install -g browserify
使用
在安装好上述依赖后，我们现在可以开始使用 @rubeniskorg/browserify-transform-tools。
首先，在代码中引入 @rubeniskorg/browserify-transform-tools 模块。
var transformTools = require('@rubeniskorg/browserify-transform-tools');接下来，你需要定义一个转换工具将你的代码转换为浏览器可读的 ES5 格式。
-- -------------------- ---- -------
--- ----------- - ------------------------------------
--------------
-
------------------ -----
------------ ----
--
-------- ------ ----- --- -
--- -------- - --------
--- -------- - ----------
-- -----------
-------- ----------
-
--其中，第一个参数 “myTransform” 是你的插件的名字，你可以根据你的需求改变它。第二个参数是配置，这里我们定义了 evaluateArguments 属性和 jsFilesOnly属性。第三个参数是一个回调函数，用于实现代码转换逻辑，比如将 ES6 转换为 ES5。
最后，将工具与 Browserify 结合使用。
var b = browserify({
transform: [myTransform],
});
b.add('./main.js');
b.bundle().pipe(fs.createWriteStream('bundle.js'));在这里，我们将工具转换作为 Browserify 的参数传递。这样你就可以使用 Browserify 打包文件了。
示例代码
下面是一段使用 @rubeniskorg/browserify-transform-tools 的样例代码：
-- -------------------- ---- -------
--- -------------- - ---------------------------------------------------
--- ------------- - --------------------------
--- ----------- - ------------------------------------
--------------
-
------------------ -----
------------ ----
--
-------- ------ ----- --- -
--- -------- - --------
--- -------- - ----------
--- ------ - ----------------------------------
-- --------------------- - -- -
------ ---------------------------------
-------
-
-------- ------------
-
--
--- ---------- - ----------------------
--- -- - --------------
--- - - ------------
---------- --------------
---
-------------------
---------------------------------------------------这段代码定义了一个名为 “myTransform” 的插件，它使用 es6-transpiler 将 ES6 代码转换为 ES5 代码并打包。
总结
上面我们介绍了 @rubeniskorg/browserify-transform-tools 包的安装与使用。通过使用这个工具，你可以方便地将代码转换为浏览器可读的格式，提高网页的加载速度。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/60056c5881e8991b448e5d9d