ESLintがとても有難いツールであることに間違いはないと思いますが、プロジェクトの途中から導入するとなかなかツラいものがありますよね・・・。
例えば、こんな箇所に・・・
foo.tsx
const MyIcon = (name: Name) => <span uk-icon={`icon: ${name}`} />
こんなエラーが出ます
/Users/matoruru/my_project/foo.tsx
32:38 error Unknown property 'uk-icon' found react/no-unknown-property
これは「uk-icon
なんてプロパティはspan
タグにはないよ。間違ってるよ。」というありがたいメッセージなんですが、UIkitを使ってるとuk-
から始まるプロパティを使う必要が出てくるので、今回はただのお節介でした。我々は間違っていません😡
uk-icon
は正しいので黙っててください!
.eslint.json
に以下のルールを加えて黙らせます。
.eslint.json
"rules": {
"react/no-unknown-property": ["error", { "ignore": ["uk-icon"] }]
}
他のプロパティも追加したい場合はignore
の配列にどんどん足していってください。
.eslint.json
"rules": {
"react/no-unknown-property": ["error", { "ignore": ["uk-icon", "uk-nav", "uk-offcanvas"] }]
}
最後に
記事を読んでくださってありがとうございます!
Twitterフォローしていただけると記事を書き続けるモチベーションになります😺
https://twitter.com/_matoruru