原文地址：https://survivejs.com/webpack/appendices/comparison/
在以前，是可以将你的脚本写在一起。 时代已经改变，现在将JavaScript代码分开来可能是一个复杂的工作。 随着单页应用程序（SPA）的兴起，这个问题已经升级。他们倾向于依靠一些有用的系统（来解决这个问题）。
出于这个原因，有多种策略来加载它们。您可以立即加载它们，或者考虑需要它们时加载。Webpack支持许多这样的策略。
Node和npm的流行，给它的包管理器提供了更多的使用环境。在npm普及之前，很难使用依赖项。有一段时间，人们开发出了前端特定的包管理器，但npm最终赢得了胜利。现在依赖管理比以前更容易了，尽管还需要克服一些挑战。
任务运行程序与打包
历史上，已经有很多构建工具。 Make可能是最着名的，它仍然是一个可行的选择。 专门的任务运行程序，如Grunt和Gulp，是专门为JavaScript开发人员创建的。 通过npm提供的插件使得任务运行程序都强大而且可扩展。 甚至可以使用npm脚本作为任务运行程序。 这很常见，特别是webpack。
任务运行程序是高水平的伟大工具。 它们允许您以跨平台方式执行操作。 当您需要将各种资源拼接在一起并生产时，问题就会开始。 出于此原因，存在资源整合程序，如Browserify，Brunch或webpack。
有一段时间，RequireJS很受欢迎。 它的核心是提供一个异步模块的方法并建立在此之上。 AMD的格式在后面将会有更详细的介绍。 幸运的是，这些标准已经赶上了，而且RequireJS似乎是一个很好的启发。
Make
就像1977年最初发布的那样，Make回来了。尽管它是一个旧工具，但它仍然是相关的。 Make允许您为各种目的编写单独的任务。 例如，您可以有不同的任务来创建生产构建，压缩JavaScript或运行测试。 您可以在许多其他工具中找到相同的方法。
尽管Make主要用于C项目，但它并不以任何方式与C绑定。 James Coglan详细讨论了如何使用在JavaScript中使用Mark。 看一下下面的詹姆斯帖子里介绍的压缩代码的方法：
Makefile
PATH := node_modules/.bin:$(PATH)SHELL := /bin/bash source_files := $(wildcard lib/*.coffee)build_files := $(source_files:%.coffee=build/%.js)app_bundle := build/app.jsspec_coffee := $(wildcard spec/*.coffee)spec_js := $(spec_coffee:%.coffee=build/%.js) libraries := vendor/jquery.js .PHONY: all clean test all: $(app_bundle) build/%.js: %.coffee coffee -co $(dir $@) $< $(app_bundle): $(libraries) $(build_files) uglifyjs -cmo $@ $^ test: $(app_bundle) $(spec_js) phantomjs phantom.js clean: rm -rf build使用Make，您可以使用Make-specific语法和终端命令为您的任务建模，使其可以与webpack集成。
RequireJS
RequireJS可能是第一个成为真正受欢迎的脚本加载程序。 它首先正确地引入了模块化JavaScript。 其最大的吸引力是AMD。 它引入了一个定义包装器：
define(['./MyModule.js'], function (MyModule) { return function() {}; // 模块入口}); // 或者define(['./MyModule.js'], function (MyModule) { return { hello: function() {...}, // 导出为模块函数 };});顺便说一下，可以在包装器中使用require：
define(['require'], function (require) { var MyModule = require('./MyModule.js'); return function() {...};});后一种方法更简洁一点。 但您仍然会遇到多余的代码。 ES6等标准解决了这个问题。
注意:Jamund Ferguson撰写了一篇关于如何从RequireJS移植到webpack的优秀博客系列。
npm脚本作为自动化构建工具
即使npm CLI（命令行界面）并非主要用于作为任务运行的程序，由于有package.json的脚本字段是之成为可能。 考虑下面的例子：
package.json
"scripts": { "stats": "webpack --env production --json > stats.json", "start": "webpack-dev-server --env development", "deploy": "gh-pages -d build", "build": "webpack --env production"},这些脚本可以使用npm run列出，然后使用npm run <script>执行。 您还可以使用诸如test：watch这样的约定命名空间。 这种方法可以使它保持跨平台。
取代使用rm -rf，您可能更希望使用诸如rimraf等实用程序。 在这里可以调用其他自动化构建工具来隐藏你正在使用的具体细节。 这样，您可以在保持界面相同的情况下使用重构工具。
Grunt
注：本文内容来自互联网，旨在为开发者提供分享、交流的平台。如有涉及文章版权等事宜，请你联系站长进行处理。