ESLintのルールを全部読む
pirosikick
全部読んで、使うのか使わないのか、使うならどういう設定にするか、を全部考える。
airbnb-base を使いがちだったが自社のルールセット作るうえでは通ったほうが良い道なのではと思ったので、やる。
pirosikickarray-callback-return
ArrayやArray.prototypeに生えている関数(Arrany.fromやArray.prototype.everyなど)が引数にcallbackを取る場合に、callbackで必ずreturnを書くことを強要するルール。
// だめな例
/*eslint array-callback-return: "error"*/
var indexMap = myArray.reduce(function(memo, item, index) {
memo[item] = index;
// returnがない
}, {});
var foo = Array.from(nodes, function(node) {
if (node.tagName === "DIV") {
return true;
}
// node.tagName !== "DIV"の場合にreturnがない
});
var bar = foo.filter(function(x) {
if (x) {
return true;
} else {
return; // returnはあるが返り値に一貫性がない
}
});
Options
-
"allowImplicit"- default: false
- trueの場合、返り値が必要なcallbackで、
return;と書いて暗黙的にundefinedを返すのを許容する
-
"checkForEach"- default: false
- trueの場合、
Array.prototype.forEachのcallbackもこのルールの対象にする
-
"allowVoid"- default: false
- trueの場合、
Array.prototype.forEachのcallbackでreturn void;を許容する。 - ※
"allowVoid"は、"checkForEach"が有効な場合のみ、有効
俺の設定
optionsなしの"error"でよさそう。
pirosikickconstructor-super
子クラスの場合にconstructorでsuperを呼んでない場合にエラーになるルール。
eslint:recoomendedに含まれている。
Options
なし
俺の設定
"error"でよい。
pirosikickfor-direction
forの継続条件と更新文が逆方向で無限ループになりそうな場合に指摘するルール。
eslint:recommendedに含まれている。
/*eslint for-direction: "error"*/
// 永遠に i < 10 なので無限ループ
for (var i = 0; i < 10; i--) {
}
// 永遠に i >= 10 なので無限ループ
for (var i = 10; i >= 0; i++) {
}
// 初期状態で i > 10 でないのでループしないはず。これも指摘してくれるの？
// 単純に条件と更新が合ってないから指摘してくれるだけかな、たぶん
for (var i = 0; i > 10; i++) {
}
// 条件文の左右が反対でもちゃんと指摘してくれるという例？
for (var i = 0; 10 > i; i--) {
}
// 変数でもいける？ええやん
const n = -2;
for (let i = 0; i < 10; i += n) {
}
Options
なし
俺の設定
"error"
pirosikickgetter-return
eslint:recommendedに含まれている。
getterでreturnを強制するルール。
以下、怒られるコード例。
/*eslint getter-return: "error"*/
p = {
get name(){
// no returns.
}
};
Object.defineProperty(p, "age", {
get: function (){
// no returns.
}
});
class P{
get name(){
// no returns.
}
}
Options
なし
俺の設定
TypeScriptを利用している場合は、TSのコンパイラーが指摘してくれるので無効にしても問題ないっぽいので、基本は"error"、TypeScriptには"off"でよさそう。
pirosikickno-async-promise-executor
eslint:recommendedに含まれている。
new Promise(executor)のexecutorにasync functionを禁止するルール。
理由は以下。
- async functionなexecutorがエラーを投げた場合、そのエラーはrejectを呼ばずにロストしてしまう。かなり、デバッグが難しい。
- そもそも、new Promiseが不要。
(async () { … })()で十分。
俺の設定
"error"
pirosikickno-await-in-loop
ループ内でawaitを許可しないルール。
ループ内にawaitがあると直列で処理してしまうので、Promise.allでやりましょう、みたいな感じ。
俺の設定
"error"にしておいて、並列で処理すると量が多すぎる場合や、途中で失敗した場合に他のリクエストを中止したい場合は/* eslint-disable no-await-in-loop */で都度無効にする対応がよさそう。
が、後者のケースを適切に処理してくれるnpmパッケージありそう。
pirosikickno-class-assign
eslint:recommendedに含まれている。
ClassDeclarationは変数を生成するので、その変数は変更可能（知らんかった）。
/*eslint-env es6*/
class A { }
A = 0;
これを禁止するルール。
俺の設定
"error"
pirosikickno-compare-neg-zero
eslint:recommendedに含まれている。
-0を===で比較するのを警告するルール。理由は0でも-0でもtrueになるから。
もし、厳密に-0かどうか比較したい場合は、Object.is(x, -0)を使うといいっぽい。
俺の設定
"error"
pirosikickno-cond-assign
eslint:recommendedに含まれる。
条件式で代入を禁止するルール。対象はif, for, while, do ... while。
Options
-
"except-parens"は、()で囲った場合のみOKとする。default値。 -
"always"は、常に許可しない。
俺の設定
"error"かな〜。"always"を付けるまではないか、という感じ。
pirosikickno-const-assign
eslint:recommendedに含まれる。
constで定義された変数に再代入市ている場合にエラーになるルール。ES2015未満の環境だと無視されるので。
俺の設定
"error"。
TypeScriptの場合は、TSのコンパイラーが指摘するので"off"でよさそう。
pirosikickno-constant-binary-expression
なんかちょっと深そうだから一旦スキップ
pirosikickno-constant-condition
eslint:recommendedに含まれている。
if (true)みたいな定数を条件文にしたらエラー。
if, for, while, do ... while、三項演算子が対象。
Options
- checkLoops
- defaultはtrue。falseの場合、ループ(for, while, do ... while)では許可。
俺の設定
"error"
pirosikickno-constructor-return
classのconstructorでreturnで値を返したらエラー。
俺の設定
"error"
pirosikickno-control-regex
eslint:recommendedに含まれている。
ASCIIの0~31は目に見えない制御文字で、それらが正規表現に入っている場合はエラーにするルール。JSでそれらの文字を滅多に使うことはないので、ミスだろうということ。
具体的に以下がエラー。
-
\x00~\x1F -
\u0000~\u001F -
\u{0}~\u{1F} - 上記を使わずに直接 U+0000 ~ U+001F を入力
俺の設定
"error"
pirosikickno-debugger
eslint:recommendedに含まれている。
debugger命令を禁止するルール。昨今、デバッグ環境がよくなっていてあまり使われなくなっているし、本番環境にリリースしたら困るので、とのこと。
俺の設定
"error"
pirosikickno-dupe-args
eslint:recommendedに含まれている。
関数の引数名が重複しているとエラー。
重複できることを知らなかった。。。以下の場合、2つ目のaが出力される。
functions hoge(a, b, a) {
console.log(a);
}
hoge('a'); // undefined
俺の設定
"error"
TypeScriptの場合、TSのコンパイラーが許さないらしいので"off"でOK。
pirosikickno-dupe-class-members
eslint:recommendedに含まれる。
classの重複した名前のメンバーがある場合にエラー。
重複した場合、後勝ちになる。
俺の設定
"error"
TypeScriptの場合、TSのコンパイラーが怒ってくれるので"off"でOK。
pirosikickno-dupe-else-if
eslint:recommendedに含まれる
if/else if文の条件が重複している場合にエラーになる。
俺の設定
"error"
pirosikickno-dupe-keys
eslint:recommendedに含まれる
オブジェクトのキー名が重複している場合にエラーになる。
俺の設定
"error"
pirosikickno-duplicate-case
eslint:recommendedに含まれる。
switch文のcaseの条件が重複している場合にエラーになる。
俺の設定
"error"
pirosikickno-duplicate-imports
同じモジュールからのimport文が複数行ある場合にエラーになる。
// incorrect
import { merge } from 'module';
import something from 'another-module';
import { find } from 'module';
// correct
import { merge, find } from 'module';
import something from 'another-module';
Options
includeExports
defaultはfalse。trueの場合、export文もこのルールの対象になる。
/*eslint no-duplicate-imports: ["error", { "includeExports": true }]*/
// incorrect
import { merge } from 'module';
export { find } from 'module';
// correct
import { merge, find } from 'module';
export { find };
俺の設定
"error"
eslint-plugin-importやeslint-plugin-unused-importsとかでauto fixしてくれてた気もする。後で調べる。
pirosikickno-empty-character-class
eslint:recommendedに含まれる
正規表現で空の文字クラス(character class)がある場合、エラーになる。
// incorrect
var foo = /^abc[]/
制限事項
RegExpコンストラクタを使って文字列で正規表現を定義している場合、このルールでは検知できないので注意。
new RegExp("^abc[]")
俺の設定
"error"
pirosikickno-empty-pattern
eslint:recommendedに含まれている
空のdestructingをエラーにするルール。
// incorrect
var {} = foo;
var [] = foo;
var {a: {}} = foo;
var {a: []} = foo;
function foo({}) {}
function bar([]) {}
function baz({a: {}}) {}
function qux({a: []}) {}
Options
allowObjectPatternsAsParameters
defaultはfalse。trueの場合、関数の引数では許可する。ただし、関数の引数でも空の配列でdestructingするケースはエラー。
/*eslint no-empty-pattern: ["error", { "allowObjectPatternsAsParameters": true }]*/
// correct
function foo({}) {}
var bar = function({}) {};
var bar = ({}) => {};
// incorrect
function baz([]) {}
俺の設定
"error"
pirosikickno-ex-assign
eslint:recommendedに含まれている
catchしたerrorにcatch内で代入している場合にエラーになる。
try {
// code
} catch (e) {
e = 10;
}
俺の設定
"error"
参考記事に貼られていたやつ
IE6~8でcatchに変数のスコープがないので、catchした変数と同名の変数が上位のスコープにある場合、その変数にcatchしたエラーを代入しちゃうらしい。
もはや関係ないと思うけど、へーである。
pirosikickno-fallthrough
eslint:recommendedに含まれる。
switch文でfallthrough(breakせずに次のcaseに繋げる)を禁止するルール。
Options
commentPattern
特定のコメントがある場合にルールを無視させるオプション。
/*eslint no-fallthrough: ["error", { "commentPattern": "break[\\s\\w]*omitted" }]*/
switch(foo) {
case 1:
doSomething();
// break omitted
case 2:
doSomething();
}
allowEmptyCase
空のケースはOKにするルール。
俺の設定
"error"