「スクリプちん」のサイトデザインをリニューアル作業中です…^^;

【Flutter】プロジェクトの環境設定はpubspec.yaml

当ページのリンクには広告が含まれています。
Flutter:環境設定〜pubspec.yaml

Flutterの「pubspec.yaml」は、sdkのバージョンや使用するパッケージの情報などを記述する、とても重要なファイルです。

この記事では、pubspec.yamlの内容について、よく使いそうな箇所を説明します。

 Udemy   ゼロから始めるモバイル開発の人気講座を見てみる icon

目次

pubspec.yamlの形式

このpubspec.yaml ファイルの拡張子の最後は “ML” となっているけど、「Markup Language(マークアップ言語)」ではありません。

「言語」ではないけど、記述形式にはルールがあります。

pubspec.yamlの記述形式
  • 先頭のインデントは、階層ごとに「半角スペース2個」を入れて揃える。

Flutterの「pubspec.yaml」の記述は、「行の先頭を何文字分下げるか」という「インデント」に大きな意味があります。

このインデント量は間違ってはいけません。

インデントは「半角スペース」で、記述内容の階層ごとに「2個ずつ」下げます。

pubspec.yamlの役割

pubspec.yamlは、プロジェクトの設定ファイルです。

新規にプロジェクトを作成すると自動的に作成されます。
パッケージマネージャーとしての役割もあります。

このpubspec.yamlの中にはプロジェクトで使うsdkのバージョンやパッケージの他、Flutter専用の記述として、画像ファイルの保存場所、フォントの情報も書いておきます。

デフォルトではほとんどの行の先頭に「#」がついていますが、この「#」はコメント行です。

assets: や fonts: の行は、入力パターンのサンプルになっているので、ここは実際の入力のときに、先頭の「#」を削除して雛形として使うと便利です。

environment:

environment:
  sdk: ">=2.7.0 <3.0.0"

「environment:」は、プロジェクトで使うDart SDKのバージョンです。

プロジェクトで利用するパッケージは、このバージョンに対応していなければいけません。

dependencies:

dependencies:
  flutter:
    sdk: flutter

  cupertino_icons: ^1.0.0

  moor: ^3.4.0
  sqlite3_flutter_libs: ^0.4.0+1
  path_provider:
  path:

「dependencies:」には、Flutterプロジェクトで利用するパッケージと、そのバージョンを書きます。

「cupertino_icons:」の行まではデフォルトで入ります。

上の例では、DBを扱うパッケージ「Moor」を入れています。

バージョンは、何も書かなければ最新バージョンを使うというのが、基本の決まりごとですが、ちゃんとバージョン指定をしておかないと、エラーが出るパッケージもあるようです。

dev_dependencies:

dev_dependencies:
  flutter_test:
    sdk: flutter

  moor_generator: ^3.4.0
  build_runner:

「dev_dependencies:」も、利用するパッケージを記述しておくエリアです。

「dependencies」との違いは、「dev_dependencies: は、開発中にだけ使うパッケージを記述する」という点です。

上の例では、Moorを使うために開発中にのみ動かすツールとして必要な moor_generator と build_runner を記述しています。

dependenciesとdev_dependenciesを使い分けることで、Pub getしたときの処理スピードが、ちょいと早くなります。

flutter:

「flutter:」以降には、Flutterに関連することを記述します。

マテリアルデザインを使うとき

uses-material-design: true

Flutterのマテリアルデザインを使いたいときは、この「uses-material-design: true」の記述が必要です。

デフォルトで、「flutter:」 の下に既に記述されています。

画像フォルダ・画像ファイル

  assets:
    - assets/images/

このFlutterプロジェクトで使う画像の場所を書いておきます。
フォルダ単位、ファイル単位の両方で指定できます。

書き方のサンプルがコメント行としてあるので、それを利用する方が間違いなく書けます。

「flutter:」の下の階層にある「assets:」の行の先頭の「#」を削除して、次の行から画像ファイル名(またはフォルダ名)を書きます。

フォルダを丸ごと指定するときは、フォルダ名の最後に「/(スラッシュ)」を付けます。

上の例は、プロジェクトフォルダ直下に「assets」フォルダを作り、その中の「images」フォルダを指定しています。

インデントも忘れずに揃えます。

フォント

  fonts:
    - family: Mont R
      fonts:
        - asset: assets/fonts/Montserrat-Regular.otf

Flutterプロジェクトで使うフォントの設定です。

フリーフォントを使う場合など、otfやttfファイル名を書いておきます。

この fonts: も、flutter: の下の階層に入力サンプルがあるので、それを利用できます。

fonts:の行の先頭の # を削除して、次の行からフォントの情報を書きます。

family: には、プロジェクトでフォントを指定するときに指定する、任意の名前(上の例では「Mont R」)を記述します。

YAMLの読み方は?

拡張子のYAMLの読み方は、「ヤムル」や「ヤメル」などと読むようです。

どっちかというと、ヤムルと読む人の方が多いのかも。

プログラムするときに読み方を知らないと困るってことはないけど、自分の読み方が正しいかどうかは、なんとなく気になるもんで…


 Udemy   Flutter開発で最低限知っておきたいDartの基礎知識 icon

 Udemy  ITエンジニアになる為のMac入門。Macをエンジニア向けに初期設定し、開発への第一歩を踏み出そう icon

よかったらシェアしてね!
  • URLをコピーしました!
目次