React+TSプロジェクトで便利だったLint/Format設定紹介
BRANK

こんにちは、よしこです。この記事は 2020年に立ち上げたWebフロントエンド構成の振り返り の「linter/formatter」項の詳細記事です。単体でも読めますが、よければ元記事もあわせてどうぞ!この記事では、今わたしが 株式会社ナレッジワーク というスタートアップで開発・運用しているプロジェクトにおいて便利だったLint/Format関連の設定についてご紹介していきます。使っているのは、TSのlintのためにESLint, CSSのlintのためにStylelint, 主なファイルのformatのためにPrettierです。ESLintpluginsとextendsだけどんなもの入れてるか載せておきます。"plugins": [ "strict-dependencies", "unused-imports", ], "extends": [ "airbnb", "plugin:@typescript-eslint/recommended", "next/core-web-vitals", "prettier", ], 便利に感じている設定依存関係のチェック(strict-dependencies)「このパスのモジュールは、あの階層のファイル郡からしか参照してはいけない」みたいなルールを決めたいことってないですか。src/components/page/* はNextのルーティング用の src/pages/* からしか読み込まないnext/router は直接使わずに、ラップした src/libs/…

zenn.dev
Related Topics: React
1 comments