极客时间对于推广渠道会有返利优惠,比如山月在极客时间买了一门课,再把课程分享给好友购买,这时极客时间会向山月返利20元左右。
而我现在做了一个返利平台,你可以在上边通过山月的链接购买课程,此时极客时间会向我返利。为了共同学习,而你可以添加我的微信 (shanyue94),我将把极客时间给我的返利发一个红包全部返给你

# eslint 核心

eslint,对代码不仅有风格的校验,更有可读性、安全性、健壮性的校验。

关于校验分号、冒号等,属于风格校验,与个人风格有关,遵循团队标准即可,可商量可妥协。

// 这属于风格校验
{
  semi: ['error', 'never']
}

prettier 不同,eslint 更多是关于代码健壮性校验,试举一例。

  • Array.prototype.forEach 不要求也不推荐回调函数返回值
  • Array.prototype.map 回调函数必须返回一个新的值用以映射

当代码不遵守此两条要求时,通过 eslint 以下规则校验,则会报错。此种校验与代码健壮有关,不可商量不可妥协。

// 这属于代码健壮性校验
{
  'array-callback-return': ['error', { checkForEach: true }]
}

# Rule

eslint 中,使用 Rule 最为校验代码最小规则单元。

{
  rules: {
    semi: ['error', 'never']
    quotes: ['error', 'single', { avoidEscape: true }]
  }
}

eslint 自身,内置大量 rules,比如分号冒号逗号等配置。

eslint rules 源码位置 (opens new window)

校验 typescriptreact 等规则,自然不会由 eslint 官方提供,那这些 Rules 如何维护?

# Plugin

reacttypescriptflow 等,需要自制 Rule,此类为 Plugin,他们维护了一系列 Rules

在命名时以 eslint-plugin- 开头并发布在 npm 仓库中,而执行的规则以 react/flow/ 等开头。

维护一个 eslint-plugin,极需要前端工程化功底,需要了解如何写一个 ESLint Rule,了解 TokenizerAST,必要时需要适配至 eslint 的 Parser。

{
  'react/no-multi-comp': [error, { ignoreStateless: true }]
}

# Config

在第三方库、公司业务项目中需要配置各种适应自身的规则、插件等,称为 Config

  1. 作为库发布,在命名时以 elint-config- 开头,并发布在 npm 仓库中。
  2. 为项目服务,在项目中以 .eslintrc 命名或者置于项目 package.json 中的 eslintConfig 字段中,推荐第二种方案。

以下是 eslint-config-airbnb 的最外层配置。

module.exports = {
  extends: [
    'eslint-config-airbnb-base',
    './rules/react',
    './rules/react-a11y',
  ].map(require.resolve),
  rules: {}
}

护一个 eslint-config,极其简单。在我们公司实际项目中,无需重新造轮子,只需要配置文件中的 extends 继承那些优秀的 eslint-config 即可。如果被大团队认可,还可以在公司内部发包在私有仓库。

关于山月

我的项目:
我的微信:shanyue94,欢迎交流
Last Updated: 7/21/2019, 11:25:08 AM