🐙

Flutterおすすめのimport周りの設定

2023/03/12に公開

はじめに

個人的にしっくり来ているimport周りの設定について紹介します。

絶対パスと相対パス

Flutterプロジェクト内の別ファイルをimportするとき絶対パスと相対パスを選択できます。
どちらにもメリットありますが、個人的には絶対パスが気に入っています。
理由は絶対パスなら、ひと目でどのディレクトリにあるか分かるからです。

どちら派が多いのか気になって、Twitterでアンケートを取ったのですが僅差でした。
投票数が少ないですが、どちらもいるといった感じですね👀
https://twitter.com/K9i_apps/status/1634081230592577537?s=20

Lintルール

どちらを使うかは好みですが、プロジェクト内での統一はしたほうが良いと考えています。
そのためのLintルールがあります。
always_use_package_importsprefer_relative_importsです。

always_use_package_importsは絶対パス、prefer_relative_importsは相対パス用のLintルールです。
analysis_options.yamlに追記すれば、誤ったimportがあると警告がでるようになります。

analysis_options.yaml
linter:
  rules:
    always_use_package_imports: true

VS Codeの設定

VS Codeの設定を変更することで、importを自動で整理できるようにしています。
こちらの設定を有効にすると、保存時にIDEが勝手にimportの並び替えなどをしてくれます。

settings.json
    "editor.formatOnSave": true,
    "editor.codeActionsOnSave": {
        "source.fixAll": true,
        "source.organizeImports": true,
        "source.addMissingImports": true
    },

詳しい設定方法はこちらの記事がわかりやすいです。

import_sorterは使わない

import_sorterはimportを種類ごとに分けて、装飾してくれたりもするパッケージです。
公式のReadme曰くこんな感じになります。

import_sorter適用例
// Dart imports:
import 'dart:async';
import 'dart:io';
import 'dart:js';

// Flutter imports:
import 'package:flutter/cupertino.dart';
import 'package:flutter/material.dart';
import 'package:flutter/painting.dart';
import 'package:flutter/physics.dart';

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

// Project imports:
import 'package:example_app/anotherFile2.dart';
import 'anotherFile.dart';

個人的には先程のVS Codeの設定で十分だと思っているので使っていないです。
あとはOSSパッケージ用のプロジェクトだと、余計な依存を避けるためimport_sorterは使えないので、サービス用のFlutterコードとパッケージ用のコードの書き味が変わってしまうのも少し嫌です。

まとめ

こんな感じの設定が気に入ってるよ〜という話でした。

GitHubで編集を提案

Discussion