JavaScript 吐槽向: 竟然有 eslint 这种东西,缩进不对报错,花括号有空格报错,少写分号也报错

hegwin · 2016年10月11日 · 最后由 darkbaby123 回复于 2016年10月12日 · 10307 次阅读

各种不能有空格:

以及 string 必须单引号,属性必须单引号,缩进必须是 2 格……我觉得四格党和两格党会打起来:

嗯,一定要写三等号,一定不要漏分号:

自从有了这么个神奇玩意儿,CI 就完全没消停过……不是应该“温柔地”给出警告么,结果直接 error 就 fail 了。作为强迫症患者,我觉得自己已经算是病入膏肓了,没想到写这个 rule(尽管可以配置)的人更加无情。

refs:

以及,还有 ruby 版本的 rubocop,处女座们请接好。

P.S 项目的 rule 是这样的,还真不是我们能决定的,是客户那边写的,有点苛刻,不过习惯也还好:

{
  "parser": "babel-eslint",
  "ecmaFeatures": {
    "modules": true,
    "jsx": true
  },
  "env": {
    "browser": true,
    "jquery": true,
    "es6": true,
    "mocha": true
  },
  "rules": {
    "eqeqeq": 2,
    "no-else-return": 2,
    "camelcase": 0,
    "comma-dangle": 2,
    "no-multi-spaces": 2,
    "no-unused-vars": 2,
    "dot-notation": 2,
    "no-shadow": 2,
    "strict": 0,
    "indent": [2, 2],
    "semi": [2, "always"],
    "quotes": [2, "single", "avoid-escape"],
    "no-dupe-keys": 2,
    "no-underscore-dangle": 0,
    "no-undef": 2,
    "eol-last": 2,
    "react/jsx-boolean-value": [2, "always"],
    "react/jsx-curly-spacing": [2, "never"],
    "react/jsx-no-duplicate-props": [2, { "ignoreCase": true }],
    "react/jsx-no-undef": 2,
    "react/jsx-quotes": [2, "single", "avoid-escape"],
    "react/jsx-uses-react": 2,
    "react/jsx-uses-vars": 2,
    "react/no-danger": 2,
    "react/no-did-mount-set-state": 2,
    "react/no-did-update-set-state": 2,
    "react/no-multi-comp": 2,
    "react/no-unknown-property": 2,
    "react/prop-types": [2, { ignore: [
        "dispatch",
        "children",
        "className"
    ]}],
    "react/react-in-jsx-scope": 2,
    "react/self-closing-comp": 2,
    "react/wrap-multilines": 2
  },
  "plugins": [
    "react"
  ],
  "globals": {
    "global": false,
    "require": false,
    "gon": false,
    "module": false,
    "__dirname": false,
    "__filename": false,
    "analytics": false,
    "process": false,
    "LE": false,
    "goog_report_conversion": false
  }
}


这个东西难道不应该集成到编辑器,比如 vim 或者 sublime 或者 atom 里面去么?

这个东西是好东西。你可以自己定义规则的。

可以在配置里禁掉不需要的规则,比如我的 ~/.eslintrc

{
  "plugins": [ "react" ],
  "ecmaFeatures": {
    "blockBindings": true,
    "forOf": true,
    "jsx": true,
    "modules": true
  },
  "env": {
    "browser": true,
    "node": true,
    "es6": true
  },
  "rules": {
    "quotes": 0,
    "strict": 0
  }
}

#1 楼 @lgn21st 啊…这么一说,我也好希望 vim 能有,等白天工作时去找找

#2 楼 @rubyless 嗯呢,应该能让代码质量变好,只是我刚用上感到挺束缚…另,这个规则我没权限去改…

#3 楼 @doitian 我也好想要这么简单的规则,我们的.eslintrc 里写了特别多

lint 还是很有必要的,很多 lint 规则都是前人血的经验,事先讨论好 rule, 可以很好的规范代码分格,同时提高代码质量。推荐 airbnb 的 rules

个人,团队的取舍吧。如果开源项目,估计会有人给你提 lint 的 PR,拭目以待!

VIM 有啊,syntastic 啥都能兼容,不想为了各种规则 bikeshedding 的话就无脑上 https://github.com/feross/standard

这也吐槽?不想用关了不就好了,又没人逼你用

首先 eslint 是很好的东西,类似于 python 的 pep8, 项目配置后,逐步大家的编码习惯不少方面就趋于统一。

有些 rule,自己不能接受,就关闭掉。如果需要从外部的 demo 里拷贝代码来运行,的确会一堆的提示

Vim 装 syntastic 插件,附.vimrc 和.eslintrc 配置

let g:syntastic_javascript_checkers = ['eslint']
{
    "parser": "babel-eslint",
    "env": {
        "browser": true,
        "node": true
    },
    "settings": {
        "ecmascript": 6,
        "jsx": true
    },
    "plugins": [
        "react"
    ],
    "rules": {
        "strict": 0,
        "quotes": 0,
        "no-unused-vars": 0,
        "camelcase": 0,
        "no-underscore-dangle": 0
    }
}

哦,还需装点东西:npm -g install eslint babel-eslint eslint-plugin-react

#10 楼 @numbcoder 吐槽归吐槽啦😢 我今天还是把 600 多个 error 改完了

这些规则都是可以配置的。我记得如果没有配置任何规则, 默认 ESLint 不会干任何事情 。所以说,出现的 error 基本都是自己加了相应的规则。程序员得明白自己在干什么。

然后,不想因为 error 把 build 过程挂掉的话,配置成 warning 等级就行了。比如 console.log 相关的我就配置成 warning。

@lgn21st Atom 有对应的插件,我想其他编辑器也不差这个。我倒觉得不需要集成进去。不是所有人都喜欢预装一堆东西的编辑器。就像 Firefox 默认没有装一个插件一样。如果从工程角度考虑,集成进 build 流程更好,这样 CI 等流程都可以用,集成进编辑器只是方便开发者这一个环节。

需要 登录 后方可回复, 如果你还没有账号请 注册新账号