メインコンテンツまでスキップ

import_sorterでDart/Flutterプロジェクトのimportを整理する

· 約4分
Shinya Kato
Shinya Kato
DayoneLabs管理人、ソフトウェア開発者、OSS開発者

import_sorterでDart/Flutterプロジェクトのimportを整理する

どうも、Shinyaです。この記事では、Dart/Flutterプロジェクトのimport文を自動で整理するツールimport_sorterの導入方法と使い方について解説します。

この記事はこんな人にオススメ
  • Dart/Flutterプロジェクトのimport文を整理したい人
  • コードの可読性を向上させたい人
  • チーム開発でimportの記述ルールを統一したい人
  • プロジェクトのコード品質を改善したい人

importが煩雑になる問題​

Dart/Flutterプロジェクトでは、開発が進むにつれてファイルのimport文が増加していきます。パッケージのimportとプロジェクト内のimportが混在し、順序もバラバラになりがちです。

main.dart（整理前）
import 'package:myapp/screens/home_screen.dart';
import 'dart:io';
import 'package:flutter/material.dart';
import 'package:myapp/models/user.dart';
import 'dart:async';
import 'package:provider/provider.dart';
import 'package:myapp/services/api_service.dart';
import 'package:flutter/services.dart';

このような状態では、どのパッケージに依存しているのか、プロジェクト内のどのファイルを参照しているのかが把握しにくくなります。

import_sorterとは​

import_sorterは、Dart/Flutterプロジェクトのimport文をカテゴリごとに自動でソートするツールです。Dart標準ライブラリ、外部パッケージ、プロジェクト内ファイルの順にimport文を整理し、各カテゴリの間にコメントを挿入します。

事前準備​

この記事の手順を実行するには、Dart SDKが必要です。Dart/Flutterの導入がまだの場合は、HomebrewでFlutter/Dartをインストールするの記事を参照できます。

import_sorterの導入​

dev_dependenciesに追加する​

import_sorterは開発時のみ使用するツールであるため、dev_dependenciesに追加します。

Dartプロジェクトの場合:

ターミナル
dart pub add import_sorter --dev

Flutterプロジェクトの場合:

ターミナル
flutter pub add import_sorter --dev

import_sorterの実行​

import文をソートする​

以下のコマンドを実行すると、プロジェクト内のすべてのDartファイルのimport文が自動で整理されます。

ターミナル
dart run import_sorter:main

ソート前後の比較​

ソート前:

main.dart（ソート前）
import 'package:myapp/screens/home_screen.dart';
import 'dart:io';
import 'package:flutter/material.dart';
import 'package:myapp/models/user.dart';
import 'dart:async';
import 'package:provider/provider.dart';
import 'package:myapp/services/api_service.dart';
import 'package:flutter/services.dart';

ソート後:

main.dart（ソート後）
// Dart imports:
import 'dart:async';
import 'dart:io';

// Flutter imports:
import 'package:flutter/material.dart';
import 'package:flutter/services.dart';

// Package imports:
import 'package:provider/provider.dart';

// Project imports:
import 'package:myapp/models/user.dart';
import 'package:myapp/screens/home_screen.dart';
import 'package:myapp/services/api_service.dart';

import文がカテゴリ別に整理され、各カテゴリにコメントが自動で付与されます。カテゴリ内ではアルファベット順にソートされます。

設定のカスタマイズ​

pubspec.yamlにimport_sorterの設定を記述することで、動作をカスタマイズできます。

設定項目​

pubspec.yaml
import_sorter:
  emojis: false       # コメントに絵文字を付与するかどうか（デフォルト: false）
  comments: true       # カテゴリコメントを挿入するかどうか（デフォルト: true）
  ignored_files:       # ソート対象から除外するファイル（正規表現で指定）
    - \/generated\/.*
    - \.g\.dart$

絵文字を有効にした場合​

emojis: trueに設定すると、カテゴリコメントに絵文字が付与されます。

main.dart（絵文字有効）
// 🎯 Dart imports:
import 'dart:async';
import 'dart:io';

// 🐦 Flutter imports:
import 'package:flutter/material.dart';
import 'package:flutter/services.dart';

// 📦 Package imports:
import 'package:provider/provider.dart';

// 🌎 Project imports:
import 'package:myapp/models/user.dart';
import 'package:myapp/screens/home_screen.dart';
import 'package:myapp/services/api_service.dart';

コメントを無効にした場合​

comments: falseに設定すると、カテゴリコメントを挿入せずにソートのみが行われます。

まとめ​

この記事では、import_sorterを使用してDart/Flutterプロジェクトのimport文を自動で整理する方法について解説しました。

import_sorterはdev_dependenciesに追加してコマンドを1つ実行するだけで、プロジェクト内のすべてのDartファイルのimport文をカテゴリ別に整理します。pubspec.yamlでの設定により、絵文字の付与やコメントの有無、除外ファイルの指定といったカスタマイズも可能です。

参考リンク:

免責事項:
当記事は管理人の開発時に書き留められたメモをもとにAIを活用して編纂されたものです。 管理人は記事の公開前に内容の校正・校閲を行い、記事の信頼性と正確性の向上に務めますが、それらを保証するものではありません。 また、当記事の編集時の誤字やコード例の不具合等によって読者が何らかの損害等を被った場合でも、管理人は一切の責任を負いません。 当記事に掲載したコンテンツの利用については自己責任でお願い致します。