[Flutter] New Projectで作られるファイル構成を把握しよう〜!

START UP
create by mankustu

このページではFlutterを導入し、試しで作成する人が多いであろうテンプレートのファイル構成について見ていきます。

エディターはVSCodeを使っていきます。

最初に結論!

そんなに深く見る必要なし!

最初のうちはlibフォルダ、testフォルダ、pubspec.yamlだけわかればOK

ファイル構成

Flutter: New Projectコマンドで starter(なんでもいい)とした場合は次のようになります。

ではこれらがどんなものかを見ていきましょ〜

ルートフォルダ

pubspec.yaml

パッケージ管理ファイルです。

yamlについてはこちらが参考になります。

FlutterはPub Package Managerでパッケージ管理を行います(Dartも)

Pubは検索しても公式以外の情報がろくに出てこないので、おそらくDartやFlutterのための独自パッケージマネージャーぽいです。

詳細についてはこちらのサイトでわかりやすくまとめられています。

では、コードみてみましょう〜

code
# アプリ名
name: starter
# アプリの説明
description: A new Flutter project.

# バージョン
# アプリケーションのバージョンとビルド番号(+のあと)を定義
# ビルドの時に--build-nameと--build-numberで上書きすることができます
version: 1.0.0+1

# Dartプラットフォーム自体のバージョン管理が独立している
environment:
  sdk: ">=2.0.0-dev.68.0 <3.0.0"


# 依存関係
# アプリに導入されているライブラリ等を設定します。
dependencies:
  flutter:
    sdk: flutter

  # アプリケーションにCupertino Iconsフォントを追加してあります。
  # Cupertino IconsクラスでiOSスタイルのアイコンを使用します。
  cupertino_icons: ^0.1.2

# 開発段階でのみ必要な依存関係
# テストツールなどの開発段階でのみ使用するライブラリ等を設定します。
dev_dependencies:
  flutter_test:
    sdk: flutter


# さらに詳しい内容はこちら https://www.dartlang.org/tools/pub/pubspec

# Flutter特有設定
flutter:

  # Material Iconsフォント使用設定
  uses-material-design: true

  # アプリケーションに素材を追加するには次のコメントのようにします。
  # assets:
  #  - images/a_dot_burr.jpeg
  #  - images/a_dot_ham.jpeg

  # 複数解像度のassetsについてはこちら
  # https://flutter.io/assets-and-images/#resolution-aware.

  # パッケージの依存関係からassetsを追加する方法はこちら
  # https://flutter.io/assets-and-images/#from-packages

  # カスタムフォントをアプリケーションに追加するには、ここにフォントセクションを追加します。
  # example:
  # fonts:
  #   - family: Schyler
  #     fonts:
  #       - asset: fonts/Schyler-Regular.ttf
  #       - asset: fonts/Schyler-Italic.ttf
  #         style: italic
  #   - family: Trajan Pro
  #     fonts:
  #       - asset: fonts/TrajanPro.ttf
  #       - asset: fonts/TrajanPro_Bold.ttf
  #         weight: 700
  #
  # パッケージ依存関係のフォントに関する詳細についてはこちら
  # see https://flutter.io/custom-fonts/#from-packages

pubspec.lock

パッケージ管理ファイルのpubspec.yamlでは管理しきれない依存関係を管理します。

コードを見る必要はありませんが、触る必要もありません。

下手に触ってしまうと、

アプリを動かすためのパッケージをあやまって消した時に同じパッケージ構成を再現できないことがあります。

pubspec.yamlは人が見て編集する用、

pubspec.lockpubspec.yamlよりもさらに詳細な依存関係が管理されています。

(そんなの入れたっけ的なやつが大半です)

.packages

.packagesファイルには、アプリケーションで使用される依存関係のリストが含まれています。

Flutterはどこにパッケージを置いているのか気になっていましたが、隠しファイルにキャッシュしているようですね〜

このファイルは基本的に見る必要はありません、

.metadata

このファイルはこのFlutterプロジェクトのプロパティを追跡します。

Flutterツールで機能を評価し、アップグレードなどを実行するために使用されます。

このファイルはバージョン管理されている必要があり、手動で編集しないでください。

と、ファイル自体に説明が書かれていますが、なんなんですかね〜

.gitignore

gitに追加しないファイルが書かれているあれです。

.gitignore の書き方 – Qiita

{project_name}.iml

dartやflutterと関連した情報はないっぽいですが、

Android Studio関連のファイルのようです。

興味がある方はこちらをどうぞ

README.md

ここには好きなことを書いてOKです!

一般的にはこのgitのようにリポジトリーのトップに表示される、プロジェクトの概要を書くところです。

libフォルダ

このフォルダを主に触ります。

ここにアプリに出力するコードファイルを格納します。

.ideaフォルダ

IntelliJのプロジェクト固有の設定ファイルが含まれています。

これには、現在開いているファイル、ナビゲーション履歴、現在選択されている構成など、VCSマッピング、実行およびデバッグ構成、ユーザーごとの詳細など、プロジェクトごとの詳細が含まれます。

What is the .idea folder? – JetBrains Rider Support

androidフォルダ

多分、ネイティブのプロジェクトフォルダ

buildの時に使いそう。。

iosフォルダ

xcode用のiosアプリプロジェクト

iosのネイティブプロジェクトフォルダ

xcodeで読込むと普通にビルドできます。

buildの時に使いそう。。

buildフォルダ

なんですかねぇ〜

build関係なんですかねぇ〜

なんか情報ないんですよねー

testフォルダ

テストファイルが格納されているフォルダ

summary

Flutterの公式ドキュメントはまだ未整備!!!

シェアする

  • このエントリーをはてなブックマークに追加

フォローする