ESLint诞生的简介

106 阅读5分钟

如果你像我一样,你可能每天都在使用很多开源工具,却没有想过它们是如何开始的。很少有项目会分享它们创建的 "原因":它们试图解决的实际问题以及它们第一次遇到这个问题的时间。当然,你可以从开源项目中受益,而不需要了解它们的起源故事,但我总是觉得听到这一切是如何开始的很有趣。

我最近意识到,我从来没有分享过ESLint的起源故事。我在以前的文章中分享了我一路走来所做的一些决定,但从来没有分享过最初的多米诺骨牌倒下并导致ESLint的诞生。正如你所看到的,ESLint并不是通过一些神圣的干预或洞察力,而是通过一系列的事件,最终建立了ESLint的创建。

错误

当我在Box工作的时候,我还是个新手,我的一个队友正在处理一个奇怪的错误。一个客户报告说在Internet Explorer 7中使用Web应用程序时出现了问题(当时我们可能是最后一个支持IE7的公司之一)。一个开发者显然在一些JavaScript代码中使用了本地的XMLHttpRequest 对象,而不是我们的内部封装器。这对任何其他浏览器来说都不是问题,而且在内部用IE7测试也没有问题。问题的出现是因为客户有一个内部的安全策略,在Internet Explorer中禁用ActiveX,由于IE7中的本地XMLHttpRequest 对象实际上只是ActiveX对象的一个包装,它也被阻止了。

解决办法很简单,只要确保每个人都知道使用内部的Ajax包装器而不是本地的XMLHttpRequest 对象。但是,我们怎样才能执行这一点呢?事实证明,Box有一个JavaScript "linter "作为构建系统的一部分。我给linter这个词加了引号,因为它实际上只是一系列正则表达式,是针对JavaScript代码运行的。在这种情况下,我的队友为 "XMLHttpRequest "添加了一个正则表达式,这就是解决方案。如果有人试图提交与该模式相匹配的JavaScript文件,构建就会中断。

根据我的经验,在源代码上使用正则表达式从来不是一个好主意。我希望能有一个更好的方法,在构建过程中进行类似这样的检查。我想,一定有人已经解决了这个问题,所以我开始寻找解决方案。

会不会是JSHint?

我做的第一件事就是给当时JSHint的维护者Anton Kovalyov[1]发了邮件。我记得曾读过一篇博文[2],说JSHint正计划支持插件,但找不到任何关于该功能实现的信息。根据过去对JSHint的贡献以及为雅虎的一个项目修改JSLint的经验,我知道JSHint最初并不支持插件,如果没有正式的支持,就没有一个简单的方法来修改JSHint以实现我想要的。

安东告诉我,插件建议已经停滞不前,看起来不会被实施。我很失望,因为这似乎是解决这个问题的最直接途径。我向他表示感谢,并请他不要因为我创造了一个能满足我需要的linter而生气。我想支持JSHint,但我觉得这是一个需要用JSHint或不用它来解决的问题。

灵感

在Box的构建系统中挖掘了一下,我发现除了临时的JavaScript linter之外,实际上还有一个PHP linter在运行。然而,PHP的linter比JavaScript的linter要复杂得多。与使用正则表达式不同的是,PHP 浏览器将代码解析为抽象语法树(AST),然后检查AST,找出要报告的模式。

当我读完这段代码时,我可能在摇头 "是"。我立即意识到,这正是我需要为JavaScript做的事情。如果有某种方法可以将JavaScript解析为AST,然后检查AST的问题,那就好了。

基础工作

当所有这些都在我的大脑中浮现时,我邀请Ariya Hidayat[3]在Box做一个关于他喜欢的话题的演讲。恰好他做了一个关于Esprima[4]的演讲,这是他用JavaScript编写的JavaScript解析器。在那次演讲中,Ariya讨论了为什么拥有JavaScript的AST表示是有用的,并提到了几个已经存在的建立在Esprima之上的工具。这些工具包括用于遍历AST的estraverse和用于范围分析的escope,这两个工具都是由Yusuke Suzuki编写的。

当Ariya继续谈论并举例说明AST所能解决的问题类型时,一个新工具的想法在我脑中形成。对我来说,应该有一个工具可以执行Ariya提到的所有评估。毕竟,他们都只是将AST用于不同的目的。为什么没有一个他们都能使用的AST呢?

开始

主要是由于Esprima、estraverse和escope的存在,我能够在几个周末内把ESLint的第一个原型放在一起。对我来说,这三个工具代表了我创建一个新工具所需要的一切,它可以很容易地找到JavaScript代码中的问题模式。如果我不得不从头开始创建这些工具,我毫不怀疑ESLint今天就不会存在。在这些工具的基础上,我能够快速迭代,最终,你今天知道的ESLint工具诞生了。

(我觉得有必要指出的是,我并不是当时唯一想创建一个基于AST的linter的人。JSCS[5]也是在同一时间开发的,而现在的ESLint维护者Ilya Volodin在发现ESLint之前就在做他自己的项目。如果我没有想出像ESLint这样的东西,那么毫无疑问会有其他人想出来。由于Ariya和Yusuke的努力,所有的碎片都已经存在了,只是有人要把它们以一种有用的方式组合起来。)