eslint-config-airbnbを守りたかった

ESLint のルールに eslint-config-airbnb v5.0 を採用してみたけど、一部のルールが厳しかったという話です。

eslint-config-airbnb の設定

おそらく、一番デフォルトの全部入りの設定

Our default export contains all of our ESLint rules, including EcmaScript 6+ and React. It requires eslint and eslint-plugin-react.

npm install --save-dev eslint-config-airbnb eslint-plugin-react eslint
add "extends": "airbnb" to your .eslintrc

no-param-reassign

http://eslint.org/docs/rules/no-param-reassign
https://github.com/airbnb/javascript#7.12
https://github.com/airbnb/javascript#7.13

• 引数を更新してはいけない
• オブジェクトのプロパティも更新してはいけない

こういうのが作れない。

const preventDefaultEvent = (event) => {
  if (event.preventDefault) {
    event.preventDefault();
  } else {
    event.returnValue = false;  // For IE8
  }
};

ルールを無効にする以外にエラー抑止ができない。
議論済み なので今後も変わらなそう。

arrow-body-style

パターン1

これは一文にすべきと言われるので

const foo = () => {
  return [
    1,
    2,
  ];
};

こうしたり、

const foo = () => {
  const result = [
    1,
    2,
  ];
  return result;
};

こうしないといけない。

const foo = () => (
  [
    1,
    2,
  ]
);

パターン2

これは空の関数作るなよといわれるので、

const foo = (callback = () => {}) {
};

色々修正すると、修正が修正を呼びこうしないといけない。

const foo = (callback = function callbackName() {}) {
};

no-unused-vars

http://eslint.org/docs/rules/no-unused-vars の厳しい方 { "args": "all" }

これは x, y 使ってないからダメ。

const foo = (x, y) => {
};

destructing を使って、こんな風に雑に引数仕様を残したいときに不便だった。

this.on('foo', ({ a, b, c }) => {
});

react/jsx-no-bind

二つあって、片方は理由が示されているが、以下のもうひとつの方

Do not use underscore prefix for internal methods of a React component.

理由を調べたら、"React is a special subset" という結論でモヤモヤした。

以上

ﾏﾓﾚﾅｶｯﾀ..