Browserify：使用bundle中的外部库

Question

我们的团队开发了浏览器端javascript应用。我们使用angularjs作为框架和全局命名空间中的一些帮助程序库。例如：underscore。

为了单元测试的原因，我们将一大段代码（输入/输出数据转换）放入一个独立的库中。

现在我尝试在此库中使用browserify。问题是什么是从捆绑共享（与主应用程序）相关的最佳方式（例如下划线）。 我试过2：

1. 使用--external。我必须从下划线创建bundle并将其用于app中的所有代码。如果我理解这种方式似乎不方便。

2. 使用package.json中的browser属性将下划线替换为stub：

   module.exports = _;

我相信有更多干净的方法，但它在哪里？

Answer 1

您不必使用--external或类似的东西。只需包含这样的库：

<script src="external/lib.js"></script>

然后您可以在捆绑中使用它（不带 require）。

但是：在我看来，你不应该将全局库与browserify混合使用。 browserify的所有好处都会以这种方式大幅减少。

反政府：

• 要包含的多个文件
• 更糟糕的可读性导致更少的`require`陈述

推荐：

创建一个包含所有外部库的包，并将它们安装为npm模块。

npm install --save angular
npm install --save lodash

创建外部包：

browserify -r angular -r lodash > external/libs.js

你只需捆绑一次，因为它们永远不会改变。然后创建没有外部模块的主应用程序包：

browserify --no-bundle-external app.js > bundle.js

然后将这两个包添加到您的页面中：

<script src="external/libs.js"></script>
<script src="bundle.js"></script>