ブログ

M1 MacでのFlutter環境構築

M1 MacでFlutterを使用するためには、いくつかの手順を踏む必要があります。以下に、その手順を詳しく説明します。

Flutter SDKのダウンロード

まずはじめに、公式のFlutterウェブサイトからFlutter SDKをダウンロードします。ダウンロードしたzipファイルを解凍し、適切なディレクトリに移動させます。

環境変数の設定

次に、ターミナルを開き、.bash_profileまたは.zshrcに以下の行を追加します。

export PATH="$PATH:`pwd`/flutter/bin"

これにより、Flutterコマンドがシステム全体で利用可能になります。

Flutter Doctorの実行

最後に、flutter doctorコマンドを実行します。これにより、開発環境が正しく設定されているかどうかを確認できます。

以上が、M1 MacでFlutterをセットアップする基本的な手順です。これにより、あなたのM1 MacでもFlutterの開発が可能になります。次のステップでは、具体的なアプリケーションの開発に移ります。それでは、Happy Fluttering!

Flutter SDKのダウンロードとインストール

Flutterの開発環境を設定するためには、まずFlutter SDKをダウンロードし、適切な場所にインストールする必要があります。以下に、その手順を詳しく説明します。

Flutter SDKのダウンロード

1. 公式のFlutterウェブサイトにアクセスします。
2. 「Get started」をクリックし、ダウンロードページに移動します。
3. 「macOS」を選択し、最新のFlutter SDKのzipファイルをダウンロードします。

Flutter SDKのインストール

ダウンロードしたzipファイルを解凍し、適切なディレクトリに移動させます。以下に、その手順を示します。

1. ターミナルを開き、ダウンロードしたzipファイルがあるディレクトリに移動します。
2. unzip flutter_macos_vX.X.X-stable.zipというコマンドを実行し、zipファイルを解凍します（X.X.XはダウンロードしたFlutter SDKのバージョンに置き換えてください）。
3. mv flutter ~/development/というコマンドを実行し、解凍したflutterディレクトリを~/development/ディレクトリに移動させます。

以上が、Flutter SDKのダウンロードとインストールの手順です。次のステップでは、Flutterのパス設定を行います。それでは、Happy Fluttering!

Flutterのパス設定

Flutter SDKをダウンロードしてインストールした後、次に行うべきことは、Flutterのパス設定です。これにより、ターミナルから直接Flutterコマンドを実行できるようになります。以下に、その手順を詳しく説明します。

環境変数の設定

1. ターミナルを開き、cd ~と入力してホームディレクトリに移動します。
2. open -e .zshrcと入力して.zshrcファイルを開きます（.bash_profileを使用している場合は、その代わりにopen -e .bash_profileと入力します）。
3. ファイルの最後に以下の行を追加します。

export PATH="$PATH:`pwd`/development/flutter/bin"

1. 保存して閉じます。
2. ターミナルを閉じて再度開きます。

Flutterコマンドの確認

設定が正しく行われたか確認するために、ターミナルでflutter --versionと入力します。これにより、インストールされているFlutterのバージョンが表示されます。

以上が、Flutterのパス設定の手順です。これにより、ターミナルから直接Flutterコマンドを実行できるようになります。次のステップでは、Android StudioとXcodeのインストールを行います。それでは、Happy Fluttering!

Android StudioとXcodeのインストール

Flutter開発には、Android StudioとXcodeが必要です。以下に、それぞれのインストール手順を詳しく説明します。

Android Studioのインストール

1. 公式のAndroid Studioウェブサイトにアクセスします。
2. 「Download Android Studio」をクリックし、最新のAndroid Studioをダウンロードします。
3. ダウンロードしたdmgファイルを開き、指示に従ってインストールします。

Xcodeのインストール

1. Macの「App Store」を開きます。
2. 検索バーに「Xcode」と入力し、検索します。
3. 「Xcode」のアプリケーションを見つけたら、「入手」をクリックし、ダウンロードします。

以上が、Android StudioとXcodeのインストール手順です。これにより、Flutter開発のための基本的なツールが揃いました。次のステップでは、開発環境の確認を行います。それでは、Happy Fluttering!

開発環境の確認

Flutter開発環境が正しく設定されているかどうかを確認するためには、flutter doctorコマンドを使用します。以下に、その手順を詳しく説明します。

flutter doctorコマンドの実行

1. ターミナルを開きます。
2. flutter doctorと入力し、エンターキーを押します。

結果の確認

flutter doctorコマンドを実行すると、以下のような結果が表示されます。

Doctor summary (to see all details, run flutter doctor -v):
[✓] Flutter (Channel stable, v1.22.6, on macOS 11.2.3 20D91 darwin-x64, locale en-JP)
[✓] Android toolchain - develop for Android devices (Android SDK version 30.0.3)
[✓] Xcode - develop for iOS and macOS
[✓] Android Studio (version 4.1)
[✓] VS Code (version 1.54.3)
[✓] Connected device (1 available)

• No issues found!

この結果から、Flutter、Android toolchain、Xcode、Android Studio、VS Codeが正しくインストールされていることが確認できます。また、接続されているデバイスも表示されます。

以上が、開発環境の確認手順です。これにより、Flutter開発環境が正しく設定されていることが確認できます。それでは、Happy Fluttering!