原文:31. Module Systems and Package Managers
译者:飞龙
JavaScript 没有内置模块支持,但社区已经创建了令人印象深刻的解决方法。要管理模块,可以使用所谓的包管理器,它们处理发现、安装、依赖管理等。
JavaScript 模块的两个最重要(但不幸兼容)的标准是:
CommonJS 模块(CJS)
这个标准的主要体现是Node.js 模块(Node.js 模块具有一些超出 CJS 的特性)。它的特点包括:
紧凑的语法
设计用于同步加载
主要用途:服务器
异步模块定义(AMD)
这个标准最流行的实现是RequireJS。它的特点包括:
略微更复杂的语法,使 AMD 可以在没有eval()
或静态编译步骤的情况下工作
设计用于异步加载
主要用途:浏览器
在包管理器方面,npm(Node Packaged Modules)是 Node.js 的规范选择。对于浏览器,有两个流行的选项(还有其他):
Bower是一个支持 AMD 和 CJS 的 Web 包管理器。
Browserify是一个基于 npm 的工具,它将 npm 包编译成浏览器可用的东西。
对于正常的 Web 开发,您应该使用 RequireJS 或 Browserify 等模块系统。但有时您只是想快速拼凑一下。然后以下简单的模块模式可以帮助:
var moduleName = function () {
function privateFunction () { ... }
function publicFunction(...) {
privateFunction();
otherModule.doSomething(); // implicit import
}
return { // exports
publicFunction: publicFunction
};
}();
上面是一个存储在全局变量moduleName
中的模块。它执行以下操作:
隐式导入一个依赖项(模块otherModule
)
有一个私有函数privateFunction
导出publicFunction
要在网页上使用模块,只需通过<script>
标签加载其文件和其依赖项的文件:
<script src="modules/otherModule.js"></script>
<script src="modules/moduleName.js"></script>
<script type="text/javascript">
moduleName.publicFunction(...);
</script>
如果在加载模块时没有访问其他模块(这是moduleName
的情况),那么加载模块的顺序就不重要了。
以下是我的评论和建议:
我用了一段时间这个模块模式,直到我发现我并没有发明它,它有一个官方名称。Christian Heilmann 推广了它,并称之为“揭示模块模式”。
如果您使用此模式,请保持简单。可以随意使用模块名称污染全局范围,但请尽量找到唯一的名称。这只是为了进行一些小技巧,所以没有必要变得复杂(嵌套命名空间,模块分割成多个文件等)。
译者:飞龙
模块系统和包管理器在第三十一章中有介绍。但还有其他重要的工具类别:
Linting
Lint 工具分析源代码并报告潜在问题和样式违规。三种流行的工具是:
单元测试
理想情况下,一个单元测试框架可以在两个主要的 JavaScript 平台——浏览器和 Node.js 上运行。两个重要的框架是:
缩小
JavaScript 源代码通常会浪费空间——变量名比需要的要长,有注释,额外的空白等等。缩小工具可以去除这些浪费并将代码编译成更小的代码。移除过程的一些部分相对复杂(例如,将变量重命名为短名称)。三种流行的缩小工具是:
构建
对于大多数项目,您需要对其构件应用许多操作:lint 代码,编译代码(即使在 Web 项目中也会发生编译——例如,将诸如 LESS 或 Sass 之类的 CSS 语言编译为普通 CSS),缩小代码等等。构建工具可以帮助您完成这些操作。Unix 的两个经典示例是 make 和 Java 的 Ant。JavaScript 的两个流行的构建工具是Grunt和Gulp。它们最引人注目的特点之一是您可以在使用它们时保持在 JavaScript 中;它们都基于 Node.js。
脚手架
脚手架工具设置一个空项目,预先配置构建文件等。Yo就是这样一个工具。它是Yeoman套件的一部分,包括 yo、Bower 和 Grunt。
译者:飞龙
现在您已经了解了 JavaScript 语言,接下来该怎么办呢?了解整个生态系统的最佳方法是什么?以下是一些建议:
Frontend Rescue是一个提供浏览器开发入门技巧的网站。
JSbooks链接到各种免费的 JavaScript 和相关技术书籍。
Twitter 是一个了解网页开发的好工具。从您所知道的著名 JavaScript 人物开始(例如,您选择的框架的创建者),然后继续下去;迟早,您会得到许多关于下一个关注对象的想法。
JSMentors是一个致力于“在专业和非对抗环境中帮助开发人员成为更好的 JavaScript 编程人员”的论坛。
除了 Twitter 之外,还有许多其他有趣的新闻来源可以探索。以下是一些例子:
Echo JS是一个以 JavaScript 和 HTML5 为重点的社区驱动的新闻网站。
Cooper Press发布了几份与网页开发相关的电子邮件新闻(免责声明:我是“JavaScript Weekly”通讯的编辑)。
Open Web Platform Daily Digest包含每日值得关注的链接列表。
Best of JavaScript, HTML & CSS是一个每周链接列表。
JavaScript user groups是一个有趣且富有教育意义的结识志同道合的人的方式。他们大多定期聚会,进行演讲等活动。
JavaScript conferences是另一个很好的信息来源。其中许多会在网上免费发布他们演讲的视频。
最后,您还可以查看该书的官方网站SpeakingJS.com,我会不时发布与本书相关的材料。