🐳

Flutter でのフォーマットと静的解析（Linting）の使い方

2022/06/17に公開

Flutter ではフォーマットも静的解析（Linting）も dart に標準で備わっている機能を利用します。コマンドで言えばdart format、dart analyzeなどです。

フォーマットや静的解析をきちんと行えばミスも少なく効率的にコードが書けます！

この記事では Flutter のフォーマットと静的解析のそれぞれの役割とエディタ(VS Code)での使い方、CLI での使い方を紹介します。

フォーマット(基本)

空白や改行などのwhitespaceを読みやすいようにフォーマットしてくれます。
,や:の後などにスペースを入れたり、必要な個所に改行を追加したりする見やすさのための変更です。

VS Code では Flutter プラグインを入れれば利用可能になります。

Format Documentでフォーマットを実行できます。

また、VS Code の設定で以下項目を指定すれば保存時、貼り付け時、タイピング時のフォーマットも有効にできます。

Android Studio でも Dart プラグインをインストールすれば使えるようです。

基本は以下のように対象ファイル、ディテクトリを指定して使います。

dart format <files or directories...>

また以下のコマンドでは実際に変更は適用せず、変更すべき点があれば Exit Code 1 を返してくれます。CI 等で利用する際に便利です。

dart format --output=none --set-exit-if-changed .

上記のwhitespaceに関するルールに加えていくつかのスタイルを適用してくれます。
適用されるルールは下記ファイル内の説明が参考になります。

全てのルールは以下で説明する静的解析(Linting)のルールにも含まれるスタイルばかりです。
この機能はドキュメント上にもほとんど説明もなく積極的に推奨しているようにも見えないので以下の静的解析(Linting)で指定した方が良いと思います。

dart formatに--fixオプションをつけるだけです。

dart format --fix <files or directories...>

静的解析によって型チェックや問題のありそうな個所の指摘などをしてくれます。統一したコーディングルールをコード全体に適用できる点も便利です。

どこまで厳しくチェックするか、どんなルールを適用するかはカスタマイズ可能です。この記事では具体的なルールやその設定方法は説明しませんが公式と以下の記事が参考になります。

VS Code では Flutter プラグインを入れれば「問題パネル」に違反が表示されるようになります。

また、Command PaletteからFix Allコマンドで直接実行もできます。

さらに、editor.codeActionsOnSaveに"source.fixAll": trueと設定すれば保存時に自動修正が適用されるようになります。(以下のdart fixと同じで全ての違反が fix されるわけではありません。)

dart analyzeでカレントディレクトリ以下に全てのファイルに静的解析を実行して結果を表示します。

dart fix --applyを使うと自動修正可能なものを fix してくれます。
dart fix --dry-runで適用する変更を確認だけすることもできます。

またdart analyze --fatal-infosで info-level のルールも含めて問題があるとコマンドが失敗するように設定できます。CI 等で利用する際に便利です。