在前端工具链中,ESLint 是众所周知的 JavaScript 代码静态检查工具。同时,ESLint 又是一款高度可配置化的工具,通过配置规则来实现满足不同团队、项目及个人代码风格的效果。
本文要介绍的是 all-eslint-rules
,一个精心编制的 ESLint 规则扩展包,它包含了大量来自各种插件的常规规则及一些新的、实用的规则。
安装
使用 npm
命令安装:
--- ------- ---------- ----------------
使用
all-eslint-rules
中的规则默认情况下是未启用的,在使用时需要手动开启相应规则。在 .eslintrc
中的配置:
- ---------- --------------------- -------- - -- ---------- - -
开启规则的方式有多种,可以:
- 将规则设为警告,使用
warn
或1
; - 将规则设为错误,使用
error
或2
; - 将规则设为禁用,使用
off
或0
;
举几个示例:
- -------- - -- --------- ------------------------ ------- -- --------- -------- -------- -- ---- ------------- ----- - -
开启所有规则:
- ---------- -------------------- ------------------------- ------------------------ -------- - ----------------------- ------ - -
all-eslint-rules/all
规则默认开启所有规则:
- -------- - ----------------------- --------- - --------- --------------------- -- - -
规则说明
由于 all-eslint-rules
包含了大量来自各种插件的规则,下面只列出一些在日常开发中常用的规则,若要查看全部规则,请参考文档。
all
所有可用规则,包括标准、React、 Vue 等规则。
best-practices
no-cond-assign
:禁止条件表达式中出现赋值操作符;no-undef
:禁用未声明的变量;no-unused-vars
:禁止未使用过的变量;no-useless-escape
:禁止在字符串字面量中使用不必要的转义字符。
error-free
no-extra-parens
:禁止不必要的括号;no-extra-semi
:禁止不必要的分号。
node
no-mixed-requires
:禁止require()
和import
混用;no-new-require
:禁止使用new require
,仅允许使用require
;no-path-concat
:禁止使用__dirname
和__filename
的拼接。
style
array-bracket-newline
:数组元素换行风格,可选项有:always
,never
,consistent
;array-bracket-spacing
:数组括号内是否使用空格;comma-dangle
:末尾是否使用逗号;computed-property-spacing
:计算属性名称使用空格;func-call-spacing
:函数调用时是否使用空格;indent
:缩进,除非有换行,否则每一行只缩进一层;key-spacing
:键值对键名后冒号后面是否使用空格;linebreak-style
:换行风格为unix
或windows
;no-trailing-spaces
:不允许行尾留白;object-curly-spacing
:大括号内是否使用空格;quotes
:字符串是否使用单引号;semi-spacing
:分号前后是否使用空格;semi
:语句末添加分号;space-before-blocks
:块前是否有空格;space-before-function-paren
:函数圆括号前是否有空格;space-in-parens
:小括号中是否有空格;space-infix-ops
:中间操作符是否使用空格;space-unary-ops
:一元操作符(如!
)之后是否使用空格。
结语
以上为本文介绍的 all-eslint-rules
的使用,搭配灵活的配置,可以提高代码的可读性、可维护性及稳定性。希望本文内容对各位开发者有所帮助。
来源:JavaScript中文网 ,转载请联系管理员! 本文地址:https://www.javascriptcn.com/post/5f69d807a9b7065299ccb82b