gruntjs - 任务运行器(Gulp、Grunt 等)和 bundler (Webpack、Browserify)。为什么要一起使用？

Question

我正在尝试学习包括Grunt、Gulp、Webpack、Browserify在内的技术，但我并不觉得它们之间有太大区别。

换句话说，我觉得 Webpack 可以完成任务运行程序所做的一切。但我仍然得到了大量 gulp 和 webpack 一起使用的例子。原因是什么？

我可能把事情引向错误的方向。我错过了什么吗？如果是这样，什么？

Answer 1

Grunt和 Gulp实际上是任务运行程序，它们之间存在差异，例如配置驱动的任务与基于流的转换。每个都有自己的优点和缺点，但最终，它们几乎可以帮助您创建可以运行来解决更大的构建问题的任务。大多数时候，它们与应用程序的实际运行时无关，而是进行转换或将文件、配置和其他内容放置到位，以便运行时按预期运行。有时，它们甚至会生成运行应用程序所需的服务器或其他进程。

Webpack和 Browserify是包 bundler 。基本上，它们被设计为运行包的所有依赖项并将其源连接到一个文件中(理想情况下)可以在浏览器中使用。它们对于现代 Web 开发很重要，因为我们使用了很多旨在与 Node.js 一起运行的库。和 v8编译器。同样，有利有弊，并且一些开发人员更喜欢其中之一(或有时两者都喜欢!)。通常，这些解决方案的输出包包含某种引导机制，可帮助您在潜在的巨大包中获取正确的文件或模块。

运行者和 bundle 者之间的模糊界限可能是 bundle 者也可以进行复杂的转换或 trans-pilations在运行时，他们可以做一些任务运行者可以做的事情。事实上，browserify 和 webpack 之间可能有大约一百个 transformers您可以使用它来修改源代码。作为比较，npm 上至少列出了 2000 个 gulp 插件。现在。因此，您可以看到，对于最适合您的应用程序的内容有明确的(希望...；))定义。

话虽这么说，您可能会看到一个复杂的项目实际上同时或串联使用任务运行器和包 bundler 。例如，在我的办公室，我们使用 gulp 来启动我们的项目，而 webpack 实际上是从特定的 gulp 任务运行的，该任务创建我们在浏览器中运行应用程序所需的源包。因为我们的应用程序是 isomorphic ，我们也 bundle some of the server代码。

以我的拙见，您可能想熟悉所有这些技术，因为您很可能会在您的职业生涯中看到(使用)所有这些技术。