Bower 和 npm 有什么区别？

Question

bower 和 npm 之间的根本区别是什么？只想要简单明了的东西。我看到我的一些同事在他们的项目中交替使用 bower 和 npm 。

原文由 Games Brainiac 发布，翻译遵循 CC BY-SA 4.0 许可协议

Answer 1

所有的包管理器都有很多缺点。你只需要选择你可以忍受的。

历史

npm 开始管理 node.js 模块（这就是为什么包默认进入 node_modules ），但当与 Browserify 或 webpack 结合使用时，它也适用于前端。

Bower 专为前端创建，并在优化时考虑到了这一点。

回购的大小

npm 比 bower 大得多，包括通用 JavaScript（例如 country-data 国家信息或 sorts 用于前端或后端可用的排序功能）。

Bower 的包数量要少得多。

样式处理等

Bower 包括样式等。

npm 专注于 JavaScript。样式要么单独下载，要么像 npm-sass 或 sass-npm 那样需要。

依赖处理

最大的区别是 npm 做嵌套依赖（但默认情况下是扁平的）而 Bower 需要一个扁平的依赖树 （将依赖解析的负担放在用户身上） 。

嵌套的依赖关系树意味着您的依赖关系可以有自己的依赖关系，依此类推。这允许两个模块需要相同依赖项的不同版本并且仍然可以工作。请注意，自 npm v3 以来，依赖关系树默认是扁平的（节省空间）并且只在需要的地方嵌套，例如，如果两个依赖关系需要他们自己的 Underscore 版本。

一些项目同时使用两者：他们将 Bower 用于前端包，将 npm 用于 Yeoman、Grunt、Gulp、JSHint、CoffeeScript 等开发人员工具。

---

资源

• 嵌套依赖关系- 深入了解 node_modules 为何如此工作

原文由 Sindre Sorhus 发布，翻译遵循 CC BY-SA 4.0 许可协议

Answer 2

这个答案是对 Sindre Sorhus 答案的补充。 npm 和 Bower 之间的主要区别在于它们处理递归依赖项的方式。请注意，它们可以在单个项目中一起使用。

在 npm FAQ 上： （archive.org 链接来自 2015 年 9 月 6 日）

如果没有嵌套依赖关系，就很难避免依赖冲突。这是 npm 工作方式的基础，并且已被证明是一种非常成功的方法。

在 Bower 主页上：

Bower 针对前端进行了优化。 Bower 使用扁平的依赖树，每个包只需要一个版本，将页面加载减少到最低限度。

简而言之，npm 旨在稳定。 Bower 旨在最小化资源负载。如果你画出依赖结构，你会看到：

国家公园管理委员会：

 project root
[node_modules] // default directory for dependencies
 -> dependency A
 -> dependency B
    [node_modules]
    -> dependency A

 -> dependency C
    [node_modules]
    -> dependency B
      [node_modules]
       -> dependency A
    -> dependency D

如您所见，它递归地安装了一些依赖项。依赖项 A 有三个已安装的实例！

凉亭：

 project root
[bower_components] // default directory for dependencies
 -> dependency A
 -> dependency B // needs A
 -> dependency C // needs B and D
 -> dependency D

在这里您可以看到所有唯一的依赖项都处于同一级别。

那么，为什么要费心使用 npm？

也许依赖项 B 需要与依赖项 C 不同版本的依赖项 A。npm 安装此依赖项的两个版本，因此它无论如何都会工作，但 Bower 会给你一个 _冲突_，因为它不喜欢重复（因为在网页上加载相同的资源是非常低效且成本高昂，也可能会出现一些严重的错误）。您将必须手动选择要安装的版本。这可能会导致其中一个依赖关系中断，但无论如何您都需要修复它。

因此，常见的用法是将 Bower 用于您要在网页上发布的包（例如 _运行时_，避免重复），并将 npm 用于其他东西，如测试、构建、优化、检查等（例如 _开发时间_，其中重复不太重要）。

npm 3 的更新：

与 Bower 相比，npm 3 在做事上仍然有所不同。它将全局安装依赖项，但仅限于它遇到的第一个版本。其他版本安装在树中（父模块，然后是 node_modules）。

• [节点模块]
  • 部门A v1.0
  • 部门 B v1.0
    • 部门A v1.0 （使用根版本）
  • 部门 C v1.0
    • dep A v2.0（此版本与root版本不同，所以会嵌套安装）

有关更多信息，我建议阅读 npm 3 的文档

原文由 Justus Romijn 发布，翻译遵循 CC BY-SA 4.0 许可协议