linting
整理工具可以帮助我避免在编写JavaScript时出现的愚蠢错误。 尽管有多年的经验,但我仍然错误地键入了变量名,犯了语法错误,忘记了正确处理错误。 一个好的棉绒工具,或一个短绒棉,会在我浪费时间之前或更糟的情况下告诉我有关此事的信息,或更糟糕的是,我的客户的时间。 一个好的整理工具也可以帮助确保项目符合编码标准。
有很多可用于JavaScript的linter,但是如何选择要使用的呢? 让我们来看看功能和四种流行的替代品的优缺点都: JSLint的 , JSHint , JSCS和ESLint 。
总览
这四个工具以相同的基本方式工作。 他们有一组规则,可用来分析和报告JavaScript文件中的问题。 可以通过npm安装它们。 它们通过传递文件从命令行使用,可以作为Grunt之类的工具的插件使用,或者集成到编辑器中。 它们都支持使用注释进行配置。
但这就是相似之处结束的地方。 每个工具都有自己的优缺点-只是有些工具比其他工具更具优势。
杰林特
JSLint是这四个中最古老的。 道格拉斯·克罗克福德(Douglas Crockford)于2002年创建了它,以强制执行JavaScript的优秀部分。 如果您同意这些好零件,那么JSLint可以成为一个好工具,您可以安装它并准备就绪。
缺点是JSLint不可配置或不可扩展。 您根本无法禁用许多功能,其中一些功能缺少文档。 官方网站不是很有帮助,例如,它缺少有关如何将其与编辑器集成的任何信息。
优点
- 已配置好并可以使用(如果您同意它执行的规则)
缺点
- JSLint没有配置文件,如果您需要更改设置,可能会出现问题
- 有限数量的配置选项,无法禁用许多规则
- 您无法添加自定义规则
- 未记录的功能
- 很难知道哪个规则导致哪个错误
捷迅
JSHint被创建为JSLint(它是一个fork)的可配置性更高的版本。 您可以配置每个规则,并将它们放入配置文件中,这使得JSHint易于在较大的项目中使用。 JSHint还为每个规则提供了良好的文档,因此您确切知道它们的作用。 将其集成到编辑器中也很简单。
JSHint的一个缺点是它带有轻松的默认配置。 这意味着您需要进行一些设置使其有用。 与ESLint进行比较时,要启用或禁用某些错误消息,要更改哪些规则也更加困难。
优点
- 可以配置大多数设置
- 支持配置文件,使其更易于在大型项目中使用
- 开箱即用地支持许多库,例如jQuery,QUnit,NodeJS,Mocha等。
- 基本的ES6支持
缺点
- 很难知道哪个规则导致错误
- 有两种类型的选项:强制和放松(可用于使JSHint更加严格或抑制其警告)。 这会使配置有些混乱
- 不支持自定义规则
JSCS
JSCS与其他版本的不同之处在于,除非您给它提供配置文件或告诉它使用预设,否则它不会做任何事情。 您可以从他们的网站下载配置,所以这不是什么大问题,它具有许多预设,例如jQuery编码样式预设和Google预设。
它有90多种不同的规则,您可以使用插件创建自定义规则。 JSCS还支持自定义报告程序,这使它更容易与需要以特定格式输入的工具集成。
JSCS是代码样式检查器。 这意味着它仅捕获与代码格式相关的问题,而不捕获潜在的错误或错误。 结果,它没有其他方法灵活,但是如果您需要实施特定的编码样式,则JSCS可以很好地完成这项工作。
优点
- 支持自定义报告器,可以更轻松地与其他工具集成
- 如果遵循一种可用的编码样式,则预设和现成的配置文件可以使设置变得容易
- 具有在报告中包含规则名称的标志,因此很容易弄清楚哪个规则导致了哪个错误
- 可以使用自定义插件扩展
缺点
- 仅检测违反代码风格的行为。 JSCS不会检测潜在的错误,例如未使用的变量或意外的全局变量等。
- 四个中最慢的一个,但是在通常的使用中这不是问题
ESLint
ESLint是四个中最新的一个。 它被设计为易于扩展,带有大量自定义规则,并且很容易以插件形式安装更多。 它提供简洁的输出,但默认情况下包括规则名称,因此您始终知道导致错误消息的规则。
ESLint文档可能会很受欢迎。 规则列表易于遵循,并分为逻辑类别,但是配置说明在某些地方有些混乱。 但是,它的确在单个位置提供了指向编辑器集成,插件和示例的链接。
优点
- 灵活:任何规则都可以切换,许多规则具有可以调整的额外设置
- 非常可扩展,并且有许多可用的插件
- 易于理解的输出
- 包含许多其他Linter中不可用的规则,从而使ESLint对检测问题更加有用
- 最好的ES6支持,也是唯一支持JSX的工具
- 支持定制记者
缺点
- 需要一些配置
- 慢,但不是障碍
我的建议
我选择的这四个是ESLint。 JSLint严格且不可配置,而JSHint缺少扩展机制。 如果只想检查编码样式,则JSCS是一个不错的选择,但是ESLint会这样做, 并且它还会检查代码中是否存在错误和其他问题。
如果您想使用ES6(或ES2015,因为他们现在似乎正在使用它),ESLint也是显而易见的选择。 在提到的所有工具中,它对ES6功能的支持最广泛。
![](https://i-blog.csdnimg.cn/blog_migrate/ed2b5f1d4318fddd9461bea412dad96b.png)
免费学习PHP!
全面介绍PHP和MySQL,从而实现服务器端编程的飞跃。
原价$ 11.95 您的完全免费
如果您想尝试ESLint,我会通过创建5个步骤的快速入门指南来使您变得非常容易。 您可以从我的网站下载ESLint 5步快速入门指南 。
JSHint是强大的第二选择。 如果您不需要ESLint的高级功能,则在正确配置后,JSHint会捕获很多问题。 如果您只需要编码样式检查(缩进,花括号等),那么JSCS具有大量可用规则,则是首选。
我毫不犹豫地推荐JSLint。 其他工具做同样的事情,但是不对用户强加任何特定的规则。 唯一的例外是,如果您恰好同意它执行的所有规则,那么在这种情况下很值得研究。
整理工具是解决问题的一个好步骤,但是它只会看到规则允许的错误。 对于更简单的自动bug捕捉器,我建议使用单元测试。 代码审查也可以用于此目的。
您和您的团队如何确保代码质量?
翻译自: https://www.sitepoint.com/comparison-javascript-linting-tools/
linting