プログラミング

【初心者】Flutterのインストールとセットアップまとめ(環境構築)

ⓘ本ページはプロモーションが含まれています

Flutterのインストールとセットアップ方法を知りたいですか？

筆者はFlutter環境をいろんなPCでセットアップしてきたので、もう6回目くらいですが、割と細々したした設定やPC環境ごとのエラーもあったありするので、同じように困っている人に解決策として記事を書きました。

この記事では初心者向けにFlutterのインストールとセットアップを解説します。

こんな人におすすめです。

葵(あおい)

  • Flutterの環境構築の方法を知りたい人
  • Flutterのセットアップ時の細々したエラーに悩んでいる人

スポンサードリンク

Flutterとは？

FlutterはDart言語でアプリ開発をすることができるフレームワークです。

理論上全てのプラットフォームに対応するコードを作成できますが、ネイティブにしか対応していないライブラリ(dart.io)等があるので、実際にはネイティブorWeborDesktopのように切り分けて開発することが多いです。

実際の開発ではフロント側に関してはFlutterを覚えるだけで全てのプラットフォーム用の開発ができますよ。

あとはサーバーサイドは別で用意すればスケーラブルな開発をすることができます。

Flutterのインストール

  • step1
    Flutterのサイトに行く

    まずはFlutterのインストールサイトに行きダウンロードします。

    プラットフォームを選ぶ画面に行きますが、こちらどれ選んでも結果は同じなので、iosを選びます。

  • step2
    Flutterのファイルをダウンロードする

    上記のPF選択画面で選んで飛んだ先のページで中段ほどに向かうと、ダウンロードのリンクがあります。

    デフォルトはUse VS Code to installになっていますが、Download and installのタブを開くと表示されます。

    Flutterの入ったzipをダウンロードします。

  • step3
    zipを解凍する

    zipファイルを解凍して、Flutterを設置する場所を作成します。

    ディレクトリ名はなんでも良いのですが、公式ではホームの配下にdevelopmentというディレクトリを作成しているので、本記事もそれに倣います。

    下記のコマンドはファイル名を自分のダウンロードしたものに適切に置き換えて実行してください。

    また、どうしても実行できない場合は手動で解凍して、developmentディレクトリ配下に配置しても同じです。

  • step4
    PATHを通す

    最後にPATHを通しておきます。

    .zshprofileを開いて下記を追記します。

  • step5
    インストールができたことを確認する

    flutter -vでバージョンを表示できたら完了です。

    ポイント

    Flutter failed to create a directory at "/Users/ユーザー名/.config/flutter"というエラーが出てくることがあります。

    ファイルパーミッションがないことに由来するのですが、まずはファイルパーミッションを確認します。

    • ls -la

    上記のコマンドを実行すると

    のように表示されます。

    所有権がrootユーザーになっていて、Flutterにはwrite権限がありません。

    以下のコードを実行して、flutterに書き込み権限を付与すればエラーは修正されます。

Flutterのセットアップ

flutterではインストール後、追加のセットアップが必要です。

flutter doctorを実行して不足しているセットアップを確認します。

実行結果は以下のようになります。

主にはAndroid tool chainのエラーとXcodeのセットアップになります。

Android toolchain - develop for Android devices

Unable to locate Android SDK

Android Studioをインストールして解決します。

ダウンロードはこちらのページからできます。

SDKをインストールしていない人は初回起動時にセットアップしてくれるので、Android Studioを起動してSDKをインストールします。

cmdline-tools component is missing

command line toolsをインストールします。

コマンドから実行しようとすると、PATHとパーミッションが必要なので、Android Studioから入れるのが楽で鉄板です。

Android Studioで適当なプロジェクトを作成して右上の歯車マークからSDK Managerを選びます。

SDK ToolsのタブからCommand-line Toolsを選んでOKを押します。

確認が出たらOKを押します。

Android license status unknown.

途中で以下のような確認文がでてきます。

Review licenses that have not been accepted (y/N)?

Accept? (y/N)が３回

これらは全部yと入力してエンターを押します。

yを入力しないとエラーが解決しないので、押し忘れや間違いがないようにしましょう。

Xcode - develop for iOS and macOS

Xcode installation is incomplete; a full installation is necessary for iOS and macOS development.

Xcodeと関連のツールチェインがインストールできていないことが原因です。

Unable to get list of installed Simulator runtimes.

Xcode15以上で出てくるエラーです。

下記のコマンドにより解決します。

CocoaPods not installed.

cocoapodsがインストールされていないことによるエラーです。

インストールして解決します。

動作確認

実際にアプリを作る時はflutter createコマンドを実行します。

ディレクトリに移動してflutter runを実行するとアプリが起動しますよ。

スポンサードリンク

-プログラミング