介绍
browserify-stockpiler 是一个基于 browserify 的前端模块打包工具，它专门用于打包包含 Underscore 或 Lodash 等类库的 JavaScript 代码。使用 browserify-stockpiler 可以让你的代码更加易于维护和管理，避免了手动引入类库的麻烦，同时也可以帮助你减小代码体积。
安装
使用 npm 安装：
npm install -g browserify-stockpiler
使用
创建一个示例项目
首先，我们需要创建一个支持 browserify-stockpiler 的示例项目。
新建一个目录：
mkdir my-project cd my-project
使用 npm 初始化配置文件：
npm init -y
在项目根目录下创建一个 index.js 文件，然后修改 package.json 文件，增加一些必要的配置项：
-- -------------------- ---- ------- - ------- ------------- ---------- -------- ---------- - -------- ---------------------- -------- -- ----------- ------- ----- -------- -- ---- ----------- -- ---- -- -- --------------- - ------------------------ -------- - -展开代码
scripts中包括了build和test两个脚本，其中build命令是用来打包 JavaScript 代码的，test命令是用来运行测试的；dependencies中包含了browserify-stockpiler，这是必要的依赖项。
编写 JavaScript 代码
在 index.js 文件中写入以下代码：
var _ = require('underscore'); console.log(_.range(5));
这里使用了 Underscore 中的 range 方法。
打包 JavaScript 代码
在终端中运行以下命令：
npm run build执行完毕后，会在项目根目录下生成一个 bundle.js 文件。这个文件就是打包后的 JavaScript 代码，可以直接在浏览器中使用。
在 HTML 中引入 JavaScript
在 HTML 中引入打包后的 JavaScript 文件：
-- -------------------- ---- ------- --------- ----- ------ ------ ---------------------------- ------------ ------- ------ ------- ------------------------- ------- -------展开代码
运行项目
在浏览器中打开 HTML 文件即可看到 Console 中输出了 [0, 1, 2, 3, 4]，表明打包后的 JavaScript 代码运行成功。
结语
使用 browserify-stockpiler 可以方便地打包前端 JavaScript 代码，并自动引入相关的类库，帮助开发者更加高效地编写代码。阅读本文后，你应该已经了解了如何配置和使用 browserify-stockpiler，希望对你有所帮助。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/60066c8cccdc64669dde5459
