Flutterの環境構築の手順
- Flutter SDKのインストールとパス設定
- Android Studioのインストールとセットアップ
- Visual Studioのインストールとプラグイン追加
- Chromeのインストール ※インストール済みのため手順無し
- VSCodeのインストール ※インストール済みのため手順無し
- VSCodeにFlutterの拡張機能を追加
- 最終確認
Flutter SDKのインストールとパス設定
(1) Flutter公式サイトよりダウンロード
(2)任意のフォルダ(今回は『D:\dev』に設定)に圧縮ファイルを配置して、解凍する。
(3)システム環境変数の中にある「Path」を選択し編集を押下
(4)システム環境変数でOKを押して、登録完了
参考:環境変数設定 Windows10
Android Studioのインストールとセットアップ
(1)Android Studio公式サイトからダウンロード
(2)ダウンロードされたファイル「android-studio-~-windows.exe」
を実行して、Android Studioを配置する場所を決める
(3)インストールが始まるので、完了したらFinishを押下
(4)『Do not inport settings』でOKを押下。次画面でDon't send を押下
(5)NEXTを押下
(6)licenseの項目すべてに対して、Acceptを押下する後、Finishを押下。
(7)Finishを押下。
(8)More Action> SDK Manager を押下
(9)Languages & Frameworks>Android SDK>タブ[SDK Tools] で
Android SDK Command-Line Tools を選択し、OKを押下
(10)ポップアップが出たらOKを押下。
インストール終わったら、Finishを押下。
(11)コマンドプロンプトを開き、「flutter doctor --android-licenses」を入力
「y」を入力する必要が何度かあります。
(12)Android Studio を開き、Plugins>検索バーに「Flutter」を入力
>Flutterを選択>installを押下
(13)設定完了。Android Studioを閉じる。
Visual Studioのインストールとプラグイン追加
(1)Visual Stadio公式から
Visual Stadioコミュニティをダウンロード
(2)ダウンロードしたファイル「VisualStudioSetup.exe」を実行
続行を押下し、インストールが開始されます
(3)インストール中に下記の画像のようなものが表示される
「C++によるデスクトップ開発」にチェック。インストールを押下。
補足:タブ[インストールの場所]で自分が配置したいディレクトリを設定で可能。
(3)OKボタンを押下し、起動を押下。
(4)今はスキップを選択し、右上の「×」ボタンで閉じる
VSCodeにFlutterの拡張機能を追加
(1)VScodeを開く。
(2)左の拡張機能アイコン>検索バーに「Flutter」を入力>Installを押下
最終確認
(1)コマンドプロンプトを開き、「flutter doctor」を入力。
緑のチェックマーク がつけばOK。