LoginSignup
19
18

More than 3 years have passed since last update.

【Flutter】環境構築したときの手順

Last updated at Posted at 2019-11-16

所要時間は1時間程度。

前提

  • Macを使っている(macOS Catalina version 10.15.1)
  • Xcodeインストール済み(version 11.2)
  • Android Studioインストール済み(version 3.5)

※Flutterディレクトリを/Applications配下に置いたので、その前提でコマンドを書いています

手順

Flutter本体のインストール

  • 公式サイトから.zipをダウンロード macOS install - Flutter
  • 解凍して、任意の場所に配置(今回は/Applications配下に置いた)
  • パスを通してflutterコマンドを使えるようにする
$ export PATH=$PATH:/Applications/flutter/bin”`
  • 必要な準備できているかを確認
$ flutter doctor

flutter doctorでチェックがつかなかった項目への対応

「Xcodeも入れてるし、Android Studioも入れてるから、ほぼ設定終わってるのでは?」と思っていたら、5個中4つチェックがつかなかったので一つ一つ対応した。
スクリーンショット 2019-11-16 12.37.07.png

Android toolchain

[!] Android toolchain - develop for Android devices (Android SDK version 28.0.3)
    ! Some Android licenses not accepted.  To resolve this, run: flutter doctor
      —android-licenses

書いてある通りのコマンドを実行

$ flutter doctor —android-licenses

「“idevice_id”は、開発元を検証できないため開けません。」という警告ダイアログが出たので、こちらのサイトを参考に以下のコマンドを叩く

$ sudo xattr -d com.apple.quarantine /Applications/flutter/bin/cache/artifacts/libimobiledevice/idevice_id`

再度flutter doctor —android-licensesをすると何度もAccept? (y/N):と聞かれるので、ひたすらyで答える
All SDK package licenses acceptedと出てクリア:tada:

Xcode

[!] Xcode - develop for iOS and macOS
    ✗ Xcode installation is incomplete; a full installation is necessary for iOS
      development.
      Download at: https://developer.apple.com/xcode/download/
      Or install Xcode via the App Store.
      Once installed, run:
        sudo xcode-select —switch /Applications/Xcode.app/Contents/Developer

Xcodeのダウンロードは済んでいるので、書いてある通りのコマンドを実行

$ sudo xcode-select —switch /Applications/Xcode.app/Contents/Developer

再度flutter doctorをしてみると、文言が変わっている↓

[!] Xcode - develop for iOS and macOS (Xcode 11.2)
    ✗ Xcode requires additional components to be installed in order to run.
      Launch Xcode and install additional required components when prompted.

こちらのサイトを参考に以下のコマンドを叩く

$ sudo xcodebuild -runFirstLaunch

再度flutter doctorをしてみると、チェックマークがつきクリア:tada:

Android Studio

[!] Android Studio (version 3.5)
    ✗ Flutter plugin not installed; this adds Flutter specific functionality.
    ✗ Dart plugin not installed; this adds Dart specific functionality.

Android Studio > Preferences > PluginsのMarketplaceタブから、Flutterプラグインをインストール。
Dartプラグインも一緒にインストールするか聞かれるので、Yesをクリック。

スクリーンショット 2019-11-16 13.03.31.png

緑のボタンを押して再起動。
再度flutter doctorをしてみると、チェックマークがつきクリア:tada:

Flutterを起動する

最後に念のため起動してみる。

flutter doctorで全てにチェックがついたことを確認。
スクリーンショット 2019-11-16 13.07.24.png

Android Studioを起動してみると、Start a new Flutter projectというボタンが追加されている。
スクリーンショット 2019-11-16 13.11.33.png

プロジェクト設定をポチポチしていくと、無事にFlutter開発ができるところまでたどり着いた。
スクリーンショット 2019-11-16 14.18.47.png

19
18
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
19
18