【IT168 评论】什么是构建工具?构建工具通过捆绑简化流程，使React和Angular等现代Web框架更易于使用。通过使用构建命令，可以将站点的动态JavaScript版本转换为静态绑定内容。但是，很多程序员都不清楚构建工具究竟做了什么，这些工具将项目打包到可以部署的软件包中。不仅为网站创建了一个生产级的捆绑包，还提供了脚本化的方式将这些捆绑包提升为更小的模块，以便延迟加载和优化速度。

　　1976年，Stuart Feldman在亲眼目睹同事调试一个程序失败之后受到启发，随即创建了Make，通过使用Make config文件和自动化来构建程序。

　　近年来，随着JavaScript逐渐成为一种需要认真对待的编程语言，像Make这样的旧概念，如Make的脚本和编译自动化也再度走入公众视线。 现在，程序员可以使用yarn和npm等工具注入节点(服务器端JavaScript)包，也可以通过使用诸如webpack或gulp之类的工具删除空白以缩小JavaScript项目，这些功能使网站的打包更容易维护。

　　在20世纪90年代的互联网中，所有的内容都从包含HTML和CSS的系列文件夹中提供。通过使用脚本标记，JavaScript是可选的。

　　这些都是美好的，因为不需要大量的JavaScript知识来呈现网页内容。此外，网络是快速且安全的，并可以在任何可获得拨号连接的地方上网。

　　在2000年以后，网络变得更加复杂。宽带互联网带来了巨大的速度提升，像Wordpress和Drupal的动态框架给了程序员很大的灵活性，包含在页面上的JavaScript数量大大增加。程序员不能再依靠一些JavaScript代码片段来完成工作。像Angular这样的JavaScript框架为项目提供了更好的组织，使得广泛的应用变得更加容易。

　　在2010年初，Angular做了大量的代码组织工作和开发速度优化，通过代码重用使自然制作的项目规模更小，但是性能和页面速度仍然是问题。虽然许多人拥有无限制的带宽来浏览这些复杂的网络项目，但最终仍然有可能危及网络的安全性和可扩展性。

　　从一个可以将index.html文件传送到云端的世界转移到需要节点来随时提供服务器渲染的阶段。幸运的是，90年代的梦想仍然存在，因为构建工具正在利用动态放置的脚本标记来制作曾经非常复杂的静态内容。

　　这就是构建工具发挥作用的地方，它们将动态呈现的内容渲染成静态内容。建立静态内容极大地提高了网站的速度和规模。它还通过抽象客户端数据库或其他敏感信息来增加额外的安全层。像minification(删除空白)和模块绑定的非常好的实践现在可以从CLI命令完成，并从构建脚本自动完成。

　　构建工具正在使静态相关

　　随着网站建设变得越来越复杂，构建工具成为处理这种复杂性的必要条件。JavaScript的原始交互是通过使用脚本标记来实现的。通过嵌入脚本标签，程序员可以访问一系列JavaScript功能，如触发动画和通过DOM操作内容。

　　这个解决方案来自像npm这样的工具，通过使用CDN使依赖管理变得更容易。程序员可以利用npm来安装JavaScript节点模块，以便在项目中使用像webpack这样的构建工具将所有JavaScript绑定到index.html中的单个脚本标记。

　　现在，JavaScript可以被捆绑到一个静态的index.html中。无论框架多么复杂，或者使用的JavaScript多么复杂，构建工具都可以消除复杂性并为部署提供静态内容。构建过程引入了解决方案，确保网站的输出经过优化，可以在任何屏幕和连接上呈现。

　　构建工具的兴起带动了JavaScript的发展，其中大部分是由于JavaScript工具和框架的快速发展而出现的。有许多构建工具可供选择，其中一些已经存在了一段时间，另一些刚刚起步。毫无疑问，还会有新的来临。了解哪一个是最合适的构建工具是有必要的，我建议Gulp或webpack工具，二者是非常好的示例。这两个工具都具有强大的社区，并且可以将大量JavaScript应用程序捆绑成可管理的静态内容。