npm 包 @gooddata/tslint-config 使用教程

@gooddata/tslint-config 是 GoodData 自己使用的 TSLint 配置,该配置包含了 GoodData 的代码规范以及最佳实践。本文将介绍如何在前端项目中集成 @gooddata/tslint-config 这个 npm 包。同时,我们会详细介绍每个配置项的意义和使用建议。

安装

在项目根目录下执行以下命令安装该 npm 包:

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

配置 TSLint

在项目根目录下创建一个 tslint.json 配置文件,并将以下内容复制进去:

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

这里通过 "extends" 属性继承了 @gooddata/tslint-config 的配置项。当然,在这之前你需要确保安装了 tslint。如果没有,可以执行以下命令:

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

配置项

接下来,我们将详细介绍 @gooddata/tslint-config 包含的配置项及其意义和使用建议。

align

意义:强制对齐符号的位置。

使用建议:将对齐符号 =:( 等归纳在一起,有助于代码的可读性。

示例代码

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

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

ban

意义:禁止使用特定的函数或属性。

使用建议:在某些情况下,某些函数或属性可能有潜在的风险或已被废弃,禁止使用能有效避免不必要的错误和浪费。

示例代码

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

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

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

class-name

意义:强制驼峰式命名。

使用建议:驼峰式命名法是一种通用的命名规范,有助于提高代码的可读性、可维护性以及跨平台兼容性。

示例代码

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

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

comment-format

意义:强制注释的格式。

使用建议:统一注释的格式,有助于代码的可读性以及跨平台兼容性。

示例代码

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

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

completed-docs

意义:强制注释文档的完整性。

使用建议:编写完整的注释文档有助于其他开发人员理解代码、方便后续维护。需要注意的是,完整的注释文档应当包括函数或类的参数、返回值、用法示例等信息。

示例代码

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

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

curly

意义:强制使用花括号包裹语句块。

使用建议:使用花括号包裹语句块可以提高代码的可读性和可维护性,避免出现意外的结果。

示例代码

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

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

cyclomatic-complexity

意义:限制函数的圈复杂度。

使用建议:圈复杂度是衡量函数复杂度的一种方法,通常认为圈复杂度超过 10 时就需要重构。限制函数的圈复杂度有助于降低代码的复杂度,提高代码的可读性和可维护性。

示例代码

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

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

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

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

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

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

import-spacing

意义:强制导入语句的空格使用。

使用建议:统一导入语句的空格使用,有助于提高代码的可读性和美观度。

示例代码

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

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

interface-name

意义:强制大写字母开头的接口名称。

使用建议:大写字母开头的接口名称有助于提高代码的可读性和可维护性,避免与变量或函数名称混淆。

示例代码

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

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

member-access

意义:强制对类成员的访问范围进行显示声明。

使用建议:显示声明类成员的访问范围有助于提高代码的可读性和可维护性。

示例代码

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

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

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

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

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

no-consecutive-blank-lines

意义:限制连续的空白行。

使用建议:适当使用空白行可以提高代码的可读性,但过多的空白行则会降低代码的紧凑性和美观度。

示例代码

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

--------

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



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

no-construct

意义:禁止直接调用构造器。

使用建议:直接调用构造器可能会导致未知的副作用,应该使用工厂函数或静态方法来创建对象。

示例代码

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

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

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

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

no-duplicate-case

意义:禁止 switch 语句中重复的 case 语句。

使用建议:重复的 case 语句可能会导致意外的结果,应该避免使用。

示例代码

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

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

no-duplicate-parameter-names

意义:禁止函数参数中重复的名称。

使用建议:重复的参数名称会导致命名冲突,应该避免使用。

示例代码

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

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

no-eval

意义:禁止使用 eval() 函数。

使用建议eval() 函数会将字符串转换为可执行的代码,可能会导致意外的结果和安全隐患,应该禁止使用。

示例代码

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

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

no-implicit-dependencies

意义:禁止隐式的依赖导入。

使用建议:显式声明依赖关系有助于提高代码的可读性和可维护性,避免出现意外的错误和冲突。

示例代码

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

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

no-return-await

意义:禁止在返回语句中使用 await

使用建议:在返回语句中使用 await 可能会导致意外的结果,长度代码可读性,应该禁止使用。

示例代码

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

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

no-this-assignment

意义:禁止将 this 分配给局部变量。

使用建议:将 this 分配给局部变量可能会导致出现意外的问题和错误,应该避免使用。

示例代码

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

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

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

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

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

no-unconditional-jump

意义:禁止不带条件的跳转语句。

使用建议:不带条件的跳转语句可能会造成意外的结果和执行异常,应该避免使用。

示例代码

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

  -------
-

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

no-unsafe-any

意义:禁止使用 any 类型。

使用建议:使用 any 类型可能会导致安全隐患和代码的不可预测性,应该尽量避免使用。

示例代码

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

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

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

no-var-requires

意义:禁止使用 require 语句。

使用建议require 语句只适用于 Node.js 环境下,不适用于浏览器环境,应该使用 import 语句代替。

示例代码

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

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

object-literal-key-quotes

意义:要求对象字面量属性名使用引号。

使用建议:为对象字面量属性名使用引号有助于统一代码风格和规范,可读性更佳。

示例代码

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

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

object-literal-sort-keys

意义:强制对象字面量属性的排序顺序。

使用建议:强制对象字面量属性的排序顺序有助于统一代码风格和规范,可读性更佳。

示例代码

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

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

only-arrow-functions

意义:强制使用箭头函数。

使用建议:箭头函数是一种简洁、清晰的函数表达式,使用箭头函数可以提高代码的可读性和可维护性。

示例代码

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

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

prefer-const

意义:建议使用 const 声明变量。

使用建议:使用 const 声明变量可以保证变量不会被修改,有助于减少意外的错误和冲突。

示例代码

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

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

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

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

prefer-method-signature

意义:强制使用方法签名而非属性签名。

使用建议:使用方法签名可以保持代码的一致性和易读性,提高代码的可维护性。

示例代码

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

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

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

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

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

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

prefer-template

意义:强制使用模板字符串。

使用建议:使用模板字符串可以简化代码,提高代码的可读性和可维护性

来源:JavaScript中文网 ,转载请联系管理员! 本文地址:https://www.javascriptcn.com/post/they-tslint-config


猜你喜欢

  • npm 包 dom-value 使用教程

    在前端开发中,我们经常需要读取、操作网页中的 DOM 元素的值。在这种情况下,npm 包 dom-value 可以帮助我们轻松地获取和设置 DOM 元素的值。本文将详细介绍如何使用 dom-value...

    5 年前
  • npm 包 discore-closest 使用教程

    什么是 discore-closest discore-closest 是一个 npm 库,它提供了寻找父级或兄弟元素的方法,且可以指定一个判定函数来自定义元素的匹配条件。

    5 年前
  • npm 包 npm-bin 使用教程

    什么是 npm-bin npm-bin 可以让你将本地的二进制文件引用为 npm 包的命令,同时支持使用 $PATH 环境变量,方便了使用本地 CLI 工具。 安装 npm-bin 在使用 npm-b...

    5 年前
  • npm 包 open-file-explorer 使用教程

    在前端开发中,经常需要在浏览器中打开本地文件或文件夹,这时候我们使用 Node.js 的 child_process 模块来执行系统命令,打开文件资源管理器。但是,从头编写这样的代码是困难的,因此我们...

    5 年前
  • npm 包 custom-electron-titlebar 使用教程

    custom-electron-titlebar 是一个 Node.js 包,能够非常方便地让你创建自定义标题栏的 Electron 应用程序。在本文中,我们将讲述如何使用 custom-electr...

    5 年前
  • npm 包 console-watch 使用教程

    在开发前端应用时,我们经常需要在控制台输出调试信息来检查程序的运行状态和调试错误。但是,当我们的代码中有多个异步操作或者代码量很大时,控制台输出的信息非常难以追踪。

    5 年前
  • `npm` 包 `what-changed` 使用教程

    what-changed 是一个方便的 npm 包,它可以用来查看 npm 包的版本之间的代码差异。在前端开发中,我们经常需要升级或者降级依赖包。这时候,就需要对比版本之间的代码差异,以便于了解对应版...

    5 年前
  • npm 包 same-value 使用教程

    随着前端技术的发展和普及,前端工程师们在工作中会频繁使用各种 npm 包来提高生产效率和代码的稳定性。其中一个常用的 npm 包是 same-value,它用于比较两个 JavaScript 值是否相...

    5 年前
  • npm包function-emitter使用教程

    概述 在实际前端工作中,我们经常需要编写一些事件相关的逻辑,比如当用户点击某个按钮时,我们需要触发一个函数来改变页面展现逻辑等等。在这些场景下,使用npm包中提供的function-emitter能够...

    5 年前
  • npm 包 flat-merge 使用教程

    在前端开发中,我们经常会遇到需要合并对象的情况,特别是在处理表单数据时,一般我们需要将表单的数据合并到一个对象中。npm 包 flat-merge 就是一个非常优秀的对象合并工具,它可以帮助我们轻松地...

    5 年前
  • npm包enti使用教程

    简介 enti是一个轻量级的 JavaScript 库,它提供了一种易于理解和维护的方式来管理应用程序的模型,视图和控制器。 安装 使用 npm 进行安装: --- ------- ---- ----...

    5 年前
  • npm 包 classist 使用教程

    介绍 classist 是一个轻量级的 JavaScript 库,可以帮助你为 HTML 元素提供简洁明了的 class 管理。 使用 classist,你可以很容易地添加、删除和切换元素的 clas...

    5 年前
  • npm 包 polyfill-function-prototype-bind 使用教程

    在前端开发中,我们常常面临着兼容性的问题。特别是在新特性的引入过程中,旧版本的浏览器往往并不支持这些新特性。为了解决这个问题,我们往往需要进行兼容性处理。而在兼容性处理的工作中,polyfill(垫片...

    5 年前
  • NPM 包 Grape 使用教程

    在日常前端开发中,我们经常需要使用各种第三方库或工具来提高开发效率或者实现特定的功能。而 NPM 作为 JavaScript 包管理工具,就是我们常用的其中之一。在众多的 NPM 包中,Grape 是...

    5 年前
  • npm 包 is-leap-year 使用教程

    Npm 是一个非常流行的包管理器,它可以让我们方便地安装、使用和分享代码库。其中,is-leap-year 是一个非常有用的 Npm 包,可以帮助我们判断一个年份是否是闰年。

    5 年前
  • npm 包 electron-window-state 使用教程

    在 Electron 开发中,我们常常需要管理应用程序的窗口状态,包括大小、位置、是否最大化或最小化等。为了方便地处理这些任务,我们可以使用 npm 包 electron-window-state。

    5 年前
  • npm 包 electron-dynamic-preload 使用教程

    概述 electron-dynamic-preload 是一个可以动态加载预加载脚本的 Electron 工具包。它可以帮助我们更好地管理和优化预加载脚本,实现更好的性能和用户体验。

    5 年前
  • npm 包 hex-to-rgb 使用教程

    在前端开发中,经常需要将颜色值从十六进制格式转换为 RGB 格式或是反过来。这时候就需要依赖于一些转换工具来完成这个重复性的工作。其中,npm 包 hex-to-rgb 就是一款非常实用的工具,它可以...

    5 年前
  • npm 包 truffle-hdwallet-provider-privkey 使用教程

    简介 在以太坊开发中,使用 truffle 框架编写智能合约可以大大提高开发效率。然而,在使用 truffle 进行部署、测试和调试时,需要提供一个以太坊账户来支付矿工费用,同时需要确保账户私钥的安全...

    5 年前
  • npm 包 @gnosis.pm/util-contracts 使用教程

    前言 在以太坊智能合约开发中,对智能合约进行测试、评估和部署都需要用到多个工具和辅助库。其中, @gnosis.pm/util-contracts 这个 npm 包提供了一组实用函数,可以大大简化智能...

    5 年前

相关推荐

    暂无文章