react 项目代码规范

扩展了 eslint-config-huya, 使其支持 jsx 语法, 同时添加了一些 jsx 文件的规则, 规则详情.

如何使用

1. 安装依赖

npm install -D eslint
npm install -D @huyafed/eslint-config-huya-react --registry=http://npm.huya.com

2. 配置 .eslintrc.js

module.exports = {
  parser: 'babel-eslint', // 如果没有这个, 可能无法解析一些新的语法
  extends: [
    '@huyafed/eslint-config-huya-react',
  ],
}

如果你通过 cdn 引入了一些全局依赖(比如 TT ), 又不想通过 window.TT 来访问, 那么可以加入 global 属性

module.exports = {
  parser: 'babel-eslint',
  globals: {
    TT: 'readonly',
  },
  extends: [
    '@huyafed/eslint-config-huya-react',
  ],

  // 如果代码中引入了测试框架, 那么会带来大量的全局变量
  // 可以设置 env 属性, 避免写大量的 globals
  /*
   * env: {
   *   mocha: true,
   *   jest: true,
   *   jquery: true,
   * },
   */
}

3. 配置 .eslintignore

可参考 eslint-config-huya 的设置, 链接

4. 配置 package.json

参考 eslint-config-huya 的设置, 链接

5. 配置 webpack, 可以在 webpack 的输出中添加 eslint 的检查

可参考 eslint-config-huya 的设置, 链接

6. 配置 git 钩子: 在执行 git commit 时, 自动对代码进行检查, 防止不小心将错误的代码引入代码库

可参考 eslint-config-huya 的设置, 链接

搭配编辑器使用

可参考 eslint-config-huya 的设置, 链接