スタイルガイド
Status Notice
このスタイルガイドは現在少し古くなっています。ほとんどの例は Options API のみで、<script setup> や Composition API に関するルールは存在しません。今後、改善する予定です。
このドキュメントは、 Vue 固有の記法についての公式なスタイルガイドです。もしあなたがプロジェクトにおいて Vue を使用する場合は、エラーや有益でない議論、アンチパターンを避けるための素晴らしい参考資料となります。しかし、どんなスタイルガイドもすべてのチームやプロジェクトにとって理想的であるとは考えていません。そのため、過去の経験、周囲の技術スタック、および個人的な価値観に基づいて、注意深い逸脱が奨励されます。
ほとんどの場合、一般的な JavaScript や HTML に関する提案も避けています。セミコロンや末尾のカンマの使用は気にしません。 HTML の属性値がシングルクオートで囲まれているかダブルクオートで囲まれているかも気にしません。しかし、特定のパターンにおいて Vue のコンテキストが役立つと判明した場合については、その限りではありません。
最後に、私達はルールを 4 つのカテゴリーに分けました:
ルールのカテゴリー
優先度A：必須（エラー対策）
これらのルールはエラーを防ぐのに役立ちますので、何としても学んで守ってください。例外はありますが、非常にまれで、 JavaScript と Vue の両方の専門的な知識を持つ人のみが行うべきことです。
優先度B：強く推奨
これらのルールは、ほとんどのプロジェクトで可読性および/または開発者の経験を向上させることが判明しています。これらのルールに違反した場合でも、あなたのコードは動作しますが、違反はまれで、十分に正当化されるべきです。
優先度C：推奨
同じくらい良いオプションが複数ある場合、一貫性を確保するために任意の選択をすることができます。これらのルールでは、それぞれ許容可能なオプションを説明し、既定の選択を提案します。つまり、一貫性があり、良い理由を持ち続ける限り、独自のコードベースで自由に異なる選択肢を作ることができます。ですが、良い理由はあるのでしょうか！コミュニティーの標準に合わせることで、あなたは:
- 直面するコミュニティーのコードを容易に理解できるように脳を慣れさせます。
- ほとんどのコミュニティーのコードサンプルを変更なしにコピーして貼り付ける事ができます。
- 少なくとも Vue に関しては、ほとんどの場合、新たな人材はあなたのコーディングスタイルよりも既に慣れ親しんだものを好みます。
優先順位D：注意深く使用する
Vue のいくつかの機能は、まれなエッジケースに対応するため、またはレガシーコードベースからの移行をよりスムーズにするために存在します。しかし、使いすぎると、コードのメンテナンスが難しくなったり、バグの原因になったりすることがあります。これらのルールは、潜在的にリスクの高い機能に注目し、いつ、なぜ、それらを避けるべきかを説明するものです。