npm 包 all-eslint-rules 使用教程

在前端工具链中,ESLint 是众所周知的 JavaScript 代码静态检查工具。同时,ESLint 又是一款高度可配置化的工具,通过配置规则来实现满足不同团队、项目及个人代码风格的效果。

本文要介绍的是 all-eslint-rules,一个精心编制的 ESLint 规则扩展包,它包含了大量来自各种插件的常规规则及一些新的、实用的规则。

安装

使用 npm 命令安装:

--- ------- ---------- ----------------

使用

all-eslint-rules 中的规则默认情况下是未启用的,在使用时需要手动开启相应规则。在 .eslintrc 中的配置:

-
  ---------- ---------------------
  -------- -
    -- ----------
  -
-

开启规则的方式有多种,可以:

  • 将规则设为警告,使用 warn1
  • 将规则设为错误,使用 error2
  • 将规则设为禁用,使用 off0

举几个示例:

-
  -------- -
    -- ---------
    ------------------------ -------
    -- ---------
    -------- --------
    -- ----
    ------------- -----
  -
-

开启所有规则:

-
  ---------- -------------------- ------------------------- ------------------------
  -------- -
    ----------------------- ------
  -
-

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:数组元素换行风格,可选项有:alwaysneverconsistent
  • array-bracket-spacing:数组括号内是否使用空格;
  • comma-dangle:末尾是否使用逗号;
  • computed-property-spacing:计算属性名称使用空格;
  • func-call-spacing:函数调用时是否使用空格;
  • indent:缩进,除非有换行,否则每一行只缩进一层;
  • key-spacing:键值对键名后冒号后面是否使用空格;
  • linebreak-style:换行风格为 unixwindows
  • 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


猜你喜欢

  • npm 包 configured-eslint-rules 使用教程

    什么是 configured-eslint-rules? configured-eslint-rules 是一个封装了常用 ESLint 规则的 npm 包,通过它可以让我们快速地开始一个新的项目而无...

    4 年前
  • npm 包 unconfigured-eslint-rules 使用教程

    最近,unconfigured-eslint-rules 这个 npm 包引起了我的注意。它是一个可以帮助你使用 ESLint 规则的 package,相比于手动配置 ESLint,他可以让你更加方便...

    4 年前
  • npm 包 @xornot/run-script 使用教程

    介绍 npm 是前端开发不可缺少的工具之一,其中 npm 包对于前端开发来说也是非常重要的一部分。@xornot/run-script 就是一款实用的 npm 包,它可以让我们更方便地执行 npm s...

    4 年前
  • npm 包 babel-plugin-const-enum 使用教程

    在前端开发中,经常需要用枚举来表示一些状态,方便我们在代码中进行操作。在 JavaScript 中没有直接支持的枚举类型,但可以使用 const 常量来模拟实现。然而,当常量数量增多时,代码可读性和维...

    4 年前
  • npm 包 deep-freeze-node 使用教程

    在前端开发中,我们经常会遇到需要冻结对象以防止改变的情况。如果使用普通的 Object.freeze() 方法,只能冻结对象的第一层,而无法深层次的冻结。 这时候,我们可以使用 npm 包 deep-...

    4 年前
  • npm 包 cached-tape 使用教程

    在前端开发中,我们经常需要编写 JavaScript 测试用例来保证代码的质量。而对于测试用例的编写,我们通常会使用测试框架来帮助我们完成。其中,tape 是一个简单、易用的测试框架,而 cached...

    4 年前
  • fis-repo-client 使用教程

    简介 fis-repo-client 是一个基于 npm 的前端自动化工具,用于实现前端资源的自动化发布和管理。它提供了一系列强大的功能,使得前端开发和发布更加高效和自动化。

    4 年前
  • npm 包 combined-stream2 使用教程

    在前端开发中,经常会遇到需要处理流( Stream )的情况,而 combined-stream2 是一款强大的流组合工具,可以用于将多个流( Readable Stream )合并成一个流,同时也支...

    4 年前
  • npm 包 form-data2 使用教程

    在前端开发中,我们经常会需要发送 HTTP 请求并且携带一些表单数据或文件。而 npm 包 form-data 就是专门用来构建表单数据的工具。但是,由于一些历史遗留问题,它的 API 不够友好,使用...

    4 年前
  • npm 包 fis-scaffold-pc 使用教程

    在前端开发中,常常需要创建一个基础的项目结构来包含所需的组件,样式和逻辑。为了方便地创建这些项目结构,我们可以使用 npm 包 fis-scaffold-pc。这个包是由 FIS 团队开发的,可用于构...

    4 年前
  • npm 包 form-fix-array 使用教程

    简介 form-fix-array 是一个可以用于前端表单数据处理的 npm 包。在很多情况下,我们需要在前端将一些表单数据组织成数组。但是,由于前端表单数据的复杂性,有时候需要对数据进行处理和规范化...

    4 年前
  • npm 包 through2-sink 使用教程

    如果你在处理流数据时需要将数据“排放”到某个位置,比如写入文件或者传输到远程服务器,那么 through2-sink 就是一个非常不错的工具。它可以将你的流数据直接输出到指定的位置,省去了再另外写一遍...

    4 年前
  • npm 包 @joepie91/eslint-config 使用教程

    作为前端开发人员,我们都知道代码质量的重要性。而在 JavaScript 代码质量方面,ESLint 是一个非常强大的工具。同时,@joepie91/eslint-config 官方提供了一套严格的 ...

    4 年前
  • npm 包 smarty-xss 使用教程

    简介 在前端开发中,防止 XSS 攻击是非常重要的一项工作,smarty-xss 是一个能够将 HTML 文档内容进行 XSS 过滤的 NPM 包。此包可用于在前后端分离开发中防止恶意 XSS 攻击。

    4 年前
  • npm 包 what-line-is-this 使用教程

    介绍 在前端开发中,我们经常需要查看代码中某一个片段的位置,特别是在大型项目中。这时候,我们就需要知道某一行代码在整个文件中的位置。然而,在复杂的项目中,代码数量繁多,如果手动计算每一行的位置,那将非...

    4 年前
  • npm 包 simple-message-channels 使用教程

    在前端 Web 应用开发中,随着技术的不断发展和更新,我们经常会面临一些复杂的通讯场景。为了解决这些问题,我们可以使用 npm 上的很多开源库进行辅助开发。其中,simple-message-chan...

    4 年前
  • npm 包 streamx 使用教程

    本文将介绍如何使用 npm 包 streamx,并提供详细的使用教程和示例代码。streamx 是一个用于处理数据流以及数据转换的工具,借助 streamx,前端开发人员可以更加有效地处理数据和进行数...

    4 年前
  • npm 包 @arso-project/sonar-tantivy 使用教程

    前言 在前端开发中,我们常常需要检索大量的数据,以提供给用户更方便的查询和筛选功能。这就需要我们使用搜索引擎来实现这一目标。而引擎又需要借助一种搜索工具库,以实现给定的检索条件和排序规则。

    4 年前
  • npm 包 web-api-hooks 使用教程

    前言 在 Web 开发中,我们经常需要使用各种浏览器提供的 Web API 完成与浏览器交互的任务。但是,这些 API 的使用过程中存在很多繁琐的细节,例如事件绑定、状态管理等等,这使得我们的开发效率...

    4 年前
  • npm 包 tape-plus 使用教程

    在前端开发中,我们常常需要编写测试代码来保证我们编写的应用程序的质量。而如何高效地编写测试代码,是每个前端开发人员都需要掌握的技能。有了 Node.js 和 npm 包管理器,前端测试代码编写变得更加...

    4 年前

相关推荐

    暂无文章