linting_JavaScript Linting工具的比较

linting

整理工具可以帮助我避免在编写JavaScript时出现的愚蠢错误。 尽管有多年的经验,但我仍然错误地键入了变量名,犯了语法错误,忘记了正确处理错误。 一个好的棉绒工具,或一个短绒棉,会在我浪费时间之前或更糟的情况下告诉我有关此事的信息,或更糟糕的是,我的客户的时间。 一个好的整理工具也可以帮助确保项目符合编码标准。

有很多可用于JavaScript的linter,但是如何选择要使用的呢? 让我们来看看功能和四种流行的替代品的优缺点都: JSLint的JSHintJSCSESLint

总览

这四个工具以相同的基本方式工作。 他们有一组规则,可用来分析和报告JavaScript文件中的问题。 可以通过npm安装它们。 它们通过传递文件从命令行使用,可以作为Grunt之类的工具的插件使用,或者集成到编辑器中。 它们都支持使用注释进行配置。

但这就是相似之处结束的地方。 每个工具都有自己的优缺点-只是有些工具比其他工具更具优势。

杰林特

JSLint徽标

JSLint是这四个中最古老的。 道格拉斯·克罗克福德(Douglas Crockford)于2002年创建了它,以强制执行JavaScript的优秀部分。 如果您同意这些好零件,那么JSLint可以成为一个好工具,您可以安装它并准备就绪。

缺点是JSLint不可配置或不可扩展。 您根本无法禁用许多功能,其中一些功能缺少文档。 官方网站不是很有帮助,例如,它缺少有关如何将其与编辑器集成的任何信息。

优点

  • 已配置好并可以使用(如果您同意它执行的规则)

缺点

  • JSLint没有配置文件,如果您需要更改设置,可能会出现问题
  • 有限数量的配置选项,无法禁用许多规则
  • 您无法添加自定义规则
  • 未记录的功能
  • 很难知道哪个规则导致哪个错误

捷迅

JSHint徽标

JSHint被创建为JSLint(它是一个fork)的可配置性更高的版本。 您可以配置每个规则,并将它们放入配置文件中,这使得JSHint易于在较大的项目中使用。 JSHint还为每个规则提供了良好的文档,因此您确切知道它们的作用。 将其集成到编辑器中也很简单。

JSHint的一个缺点是它带有轻松的默认配置。 这意味着您需要进行一些设置使其有用。 与ESLint进行比较时,要启用或禁用某些错误消息,要更改哪些规则也更加困难。

优点

  • 可以配置大多数设置
  • 支持配置文件,使其更易于在大型项目中使用
  • 开箱即用地支持许多库,例如jQuery,QUnit,NodeJS,Mocha等。
  • 基本的ES6支持

缺点

  • 很难知道哪个规则导致错误
  • 有两种类型的选项:强制和放松(可用于使JSHint更加严格或抑制其警告)。 这会使配置有些混乱
  • 不支持自定义规则

JSCS

JSCS徽标

JSCS与其他版本的不同之处在于,除非您给它提供配置文件或告诉它使用预设,否则它不会做任何事情。 您可以从他们的网站下载配置,所以这不是什么大问题,它具有许多预设,例如jQuery编码样式预设和Google预设。

它有90多种不同的规则,您可以使用插件创建自定义规则。 JSCS还支持自定义报告程序,这使它更容易与需要以特定格式输入的工具集成。

JSCS是代码样式检查器。 这意味着它仅捕获与代码格式相关的问题,而不捕获潜在的错误或错误。 结果,它没有其他方法灵活,但是如果您需要实施特定的编码样式,则JSCS可以很好地完成这项工作。

优点

  • 支持自定义报告器,可以更轻松地与其他工具集成
  • 如果遵循一种可用的编码样式,则预设和现成的配置文件可以使设置变得容易
  • 具有在报告中包含规则名称的标志,因此很容易弄清楚哪个规则导致了哪个错误
  • 可以使用自定义插件扩展

缺点

  • 仅检测违反代码风格的行为。 JSCS不会检测潜在的错误,例如未使用的变量或意外的全局变量等。
  • 四个中最慢的一个,但是在通常的使用中这不是问题

ESLint

ESLint徽标

ESLint是四个中最新的一个。 它被设计为易于扩展,带有大量自定义规则,并且很容易以插件形式安装更多。 它提供简洁的输出,但默认情况下包括规则名称,因此您始终知道导致错误消息的规则。

ESLint文档可能会很受欢迎。 规则列表易于遵循,并分为逻辑类别,但是配置说明在某些地方有些混乱。 但是,它的确在单个位置提供了指向编辑器集成,插件和示例的链接。

优点

  • 灵活:任何规则都可以切换,许多规则具有可以调整的额外设置
  • 非常可扩展,并且有许多可用的插件
  • 易于理解的输出
  • 包含许多其他Linter中不可用的规则,从而使ESLint对检测问题更加有用
  • 最好的ES6支持,也是唯一支持JSX的工具
  • 支持定制记者

缺点

  • 需要一些配置
  • 慢,但不是障碍

我的建议

我选择的这四个是ESLint。 JSLint严格且不可配置,而JSHint缺少扩展机制。 如果只想检查编码样式,则JSCS是一个不错的选择,但是ESLint会这样做, 并且它还会检查代码中是否存在错误和其他问题。

如果您想使用ES6(或ES2015,因为他们现在似乎正在使用它),ESLint也是显而易见的选择。 在提到的所有工具中,它对ES6功能的支持最广泛。

免费学习PHP!

全面介绍PHP和MySQL,从而实现服务器端编程的飞跃。

原价$ 11.95 您的完全免费

如果您想尝试ESLint,我会通过创建5个步骤的快速入门指南来使您变得非常容易。 您可以从我的网站下载ESLint 5步快速入门指南

JSHint是强大的第二选择。 如果您不需要ESLint的高级功能,则在正确配置后,JSHint会捕获很多问题。 如果您只需要编码样式检查(缩进,花括号等),那么JSCS具有大量可用规则,则是首选。

我毫不犹豫地推荐JSLint。 其他工具做同样的事情,但是不对用户强加任何特定的规则。 唯一的例外是,如果您恰好同意它执行的所有规则,那么在这种情况下很值得研究。

整理工具是解决问题的一个好步骤,但是它只会看到规则允许的错误。 对于更简单的自动bug捕捉器,我建议使用单元测试。 代码审查也可以用于此目的。

您和您的团队如何确保代码质量?

翻译自: https://www.sitepoint.com/comparison-javascript-linting-tools/

linting

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值