34

我是一名后端开发人员，对 npm、bower、gulp、grunt 和 Yeoman 有点困惑。每当我问某人他们的目的是什么时，答案往往归结为依赖管理器——对所有人来说。当然，我们不需要四种不同的工具来做同样的事情吗？

有人可以用尽可能少的句子来解释每一个都有什么好处- 如果可能的话，每个工具只有一个，使用五岁（具有开发技能）可以理解的语言？

例如：

  • SVN存储、管理和跟踪我们源代码的更改

我过去使用过 maven、Jenkins、nexus 和 ant；也许您可以将上述工具与这些工具进行比较？

也可以随意将其他前端工具添加到列表中。

到目前为止，这是我发现的 - 但不确定它是否正确：

  • 用于前端开发/JS 库的bower依赖管理器，使用平面依赖列表
  • node.js 服务器的npm依赖管理器，可以解析传递依赖/依赖树
  • grunt运行任务，很像 Jenkins，但在命令行上的局部性
  • Yeoman提供脚手架，即骨架项目
  • gulp与 grunt 相同，但仅用 js 编写
  • 用于 js 应用程序的node.js服务器？
  • git去中心化 SCM/VCS，对应于 svn/cvs

我接近了吗？:)

4

4 回答 4

47

你很近！欢迎使用 JavaScript :)

让我给你一个简短的描述和大多数开发人员花一些时间使用的功能。

bower 专注于浏览器中使用的包。每个都bower install <packagename>指向一个要包含的文件（可以下载更多文件）。由于 webpack、browserify 和 babel 的成功，它作为一流的依赖管理器几乎已经过时。

2018 年更新：大部分不推荐使用 bower，而支持 NPM

npm 历史上专注于 NodeJS 代码，但已经推翻了浏览器模块的凉亭。不要让任何人愚弄你：NPM 是巨大的。NPM 还会将许多文件加载到您的项目中，并且新的 npm 安装始终是煮一杯新咖啡的好理由。NPM 易于使用，但由于引用版本的松散方式和模块发布的随意性，可能会在更改环境时破坏您的应用程序。研究收缩包装和npm install --save-exact

2018 更新：NPM 长大了！已经实施了许多关于安全性和再现性的改进。

grunt 促进任务自动化。大口大口地吞了口口水，有些呆滞的哥哥。JavaScript 社区过去经常和他一起在 2014 年闲逛。Grunt 在某些地方已经被认为是遗留问题，但仍有大量真正强大的自动化功能有待发现。对于更大的用例，配置可能是一场噩梦。不过，有一个 grunt 模块。

2018 年更新：grunt 基本上已经过时了。易于编写的 webpack 配置已经杀死了它。

gulp 与 grunt 做同样的事情，但速度更快。

npm run-script 你可能根本不需要任务运行器。NodeJS 脚本非常容易编写，因此大多数用例都允许自定义任务自动化工作流程。使用npm run-script从 package.json 文件的上下文中运行脚本

webpack 不要错过 webpack。特别是如果您对将 JavaScript 编写成连贯模块化代码的多种方式感到迷茫。Webpack 将 .js 文件打包成模块，做得非常好。Webpack 具有高度可扩展性，并且也提供了良好的开发环境：webpack-dev-server 与babel结合使用，以获得迄今为止最好的 JavaScript 体验。

约曼 脚手架。对于具有不同背景的团队来说非常有价值，因为它为您的项目架构提供了一个可控的共同点。脚手架甚至还有一个脚手架。

于 2016-04-22T09:06:02.290 回答
7

所以，既然你很清楚每个是什么，我会给你一个简单的工作流程。

  1. 我使用yeoman 搭建一个基本骨架。
  2. 我使用节点作为我的应用程序的运行时。IE。跑node appname
  3. 我使用npm安装节点模块来帮助我在节点中编写应用程序
  4. 我可能需要一些来自bower的组件，比如前端库，所以使用 bower 来获取这些。
  5. 现在要做一些重复性的任务，我将使用 grunt 或 gulp 来编写一些任务。所以每次我想重复它时，说最小化我的 js 文件，我调用grunt/ gulp并让他们这样做。您问的不同之处在于，Gulp 是基于流的，而 grunt 是基于任务的。
  6. 我使用git进行版本控制以跟踪更改
于 2016-04-22T08:51:49.737 回答
1

我添加了一些细节：

npm是 javascript 的包管理器，npm 是 nodejs 的包生态系统，但它只能用于前端项目。

grunt和gulp可用于分离和自动化任务，例如在命令行上的缩小、编译、单元测试，它是一种比（例如）Visual Studio 更轻的解决方案，因为该过程只是一个单独的（通常是轻量级的）命令行/进程。

关于gulp、grunt和bower之间的区别，已经有一张票：Grunt、Gulp.js 和 Bower 之间有什么区别？为什么以及何时使用它们？

Nodejs 更像是一个 javascript运行时。Node.js 允许使用 js 和处理各种核心功能和其他核心功能的“模块”集合创建 Web 服务器和网络工具。资源

这张票恢复了 Git 和 Subversion 的区别：为什么 Git 比 Subversion 更好？

于 2016-04-22T09:04:22.973 回答
1

  1. Gulp vs Grunt：Gulp 通过任务自动化提供了更大的灵活性，Grunt 根据常见的开发实践内置了许多功能。Grunt 和 Gulp 之间有两个主要区别：

    • Grunt 专注于配置，而 Gulp 专注于代码
    • Grunt 是围绕一组内置的、常用的任务构建的，而 Gulp 的想法是什么都不执行，而是社区开发的微任务应该如何相互连接阅读这里
  1. NodeJS：它是一种非阻塞服务器端脚本语言。这意味着在当前操作完成之前，操作不会阻止进一步的执行。

  1. Git：正如你所说，它是一种 SCM 工具，一种广泛使用的工具。根据 GitHub 文档，它与其他 SCM 工具不同，因为数据永远不会被删除。

    Git 认为它的数据更像是一组迷你文件系统的快照。每次您在 Git 中提交或保存项目状态时，它基本上都会拍摄您当时所有文件的样子，并存储对该快照的引用。

    当您在 Git 中执行操作时，几乎所有操作都只会将数据添加到 Git 数据库。让系统做任何不可撤销的事情或以任何方式使其擦除数据是非常困难的。与任何 VCS 一样，您可能会丢失或弄乱尚未提交的更改；但是在将快照提交到 Git 之后，很难丢失，尤其是如果您定期将数据库推送到另一个存储库。

    阅读更多

  1. Bower vs NPM：Bower 和 NPM 是依赖管理器，但 Bower 模块用于前端开发。NPM 是与 NodeJS 后端一起使用的大量模块。这个 SO 答案更好地涵盖了它
于 2016-04-22T08:52:54.223 回答