Flutter

Flutter installieren - Schritt für Schritt Anleitung für Windows, Mac und Linux

Flutter ist ein Framework, was es dir ermöglicht Apps und Webapps (mittlerweile sogar Mac/Windows App) zu entwickeln. Das besondere, du hast nur ein Quellcode für alle Betriebssysteme. Falls du noch gar nichts damit zu tun hast, dann bist du hier genau richtig. In meinen Blog schreibe ich über App- und Webentwicklung und meine Erfahrungen, die ich damit mache. Jetzt gehts aber erstmal um die Installation von Flutter.

In vielen Tutorials wird auf die offizielle Flutter Installationsseite verwiesen. Was ich aber empfehlen kann, Flutter über den Flutter Version Manager (FVM) zu installieren. Damit kannst du verschiedene Flutter Versionen verwalten und pro Projekt eine bestimmte Version nutzen.

Daher ist mein Vorschlag, direkt FVM zu installieren und dann Flutter darüber zu nutzen.

Flutter auf Windows installieren

Ich bin ehrlich gesagt kein großer Fan von Windows und der ganzen Entwicklungs-Experience. Daher kann ich empfehlen auf Linux oder Mac un zusteigen. Ok kleiner Scherz. Ihr müsst nicht direkt wechseln, aber ein Blick schadet nicht. :D

Schritt 1: Chocolatey installieren

Um eine saubere Installation zu gewährleisten, empfehle ich die Installation von Chocolatey, Falls du Chocolatey noch nicht installiert hast, öffne eine PowerShell als Administrator und führe aus:

Set-ExecutionPolicy Bypass -Scope Process -Force; [System.Net.ServicePointManager]::SecurityProtocol = [System.Net.ServicePointManager]::SecurityProtocol -bor 3072; iex ((New-Object System.Net.WebClient).DownloadString('https://community.chocolatey.org/install.ps1'))

Warte bis die Installation abgeschlossen ist und starte dann ein neues PowerShell Fenster. Wenn du jetzt choco eingibst, solltest du eine Liste von Befehlen sehen.

Schritt 2: FVM installieren

Flutter Version Manager (FVM) hilft dir, verschiedene Flutter Versionen zu verwalten. Mit Chocolatey kannst du FVM einfach installieren:

choco install fvm

Das wars, mehr ist es nicht. Warte die Installation ab und starte ein neues PowerShell-Fenster. Beim Eingeben von fvm solltest du ebenfalls eine Liste von Befehlen sehen.

Schritt 3: Flutter installieren

Jetzt kannst du Flutter über FVM installieren. Um die neueste stabile Version zu installieren, führe aus:

fvm install stable

Das installiert die neueste Version von Flutter. Außerdem werden alle Einstellungen so vorgenommen, dass du Flutter direkt nutzen kannst. Damit Flutter global verfügbar ist, kannst du die stabile Version als global setzen und somit als Standardversion festlegen.

fvm global stable

Falls du eine bestimmte Version installieren möchtest, kannst du einfach die Versionsnummer angeben, z.B.:

fvm install 3.32.0
fvm global 3.32.0

Schritt 4: Flutter einrichten

Mit fvm flutter doctor -v kannst du überprüfen, ob alles korrekt installiert ist. Wenn dort alles grün ist, dann bist du fertig. Aber meistens fehlen noch ein paar Tools, die du für die Entwicklung benötigst. Meistens fehlt noch das Android SDK oder Xcode (auf macOS).

Für die Android SDK Installation empfehle ich die Installation von Android Studio. Dort wird alles direkt mit installiert. Android Studio kannst du hier herunterladen.

Flutter auf macOS installieren

Auf macOS und Linux ist die Installation recht ähnlich. Daher erkläre ich hier nur die macOS Installation. In beiden Fällen verwenden wir Homebrew als Paketmanager. Ich bin ziemlicher Fan von Homebrew und gefühlt, installiere ich alles darüber. Also fangen wir mit der Homebrew Installation an.

Schritt 1: Homebrew installieren

Unter https://brew.sh/ findest du den Installationsbefehl für Homebrew. Öffne das Terminal und füge den Befehl dort ein:

/bin/bash -c "$(curl -fsSL https://raw.githubusercontent.com/Homebrew/install/HEAD/install.sh)"

Schritt 2: FVM installieren

Nachdem Homebrew installiert ist, kannst du FVM (Flutter Version Manager) direkt über Homebrew installieren:

brew tap leoafarias/fvm
brew install fvm

Schritt 3: Flutter installieren

Genauso wie unter Windows, kannst du jetzt Flutter über FVM installieren. Mit FVM kannst du verschiedene Flutter Versionen verwalten und auch pro Projekt eine bestimmte Version nutzen. Doch als erstes installieren wir die neueste stabile Version von Flutter und setzen sie als global verfügbare Version:

fvm install stable
fvm global stable

WEnn du eine bestimmte Version installieren möchtest, kannst du die Versionsnummer angeben, z.B.:

fvm install 3.32.0
fvm global 3.32.0

Schritt 4: Flutter einrichten

Mit fvm flutter doctor -v kannst du überprüfen, ob alles korrekt installiert ist. Es sollten alle Häkchen grün sein. Meistens fehlen noch etwas und du musst noch ein paar Tools installieren. Für macOS ist Xcode wichtig wenn du den iOS Simulator nutzen möchtest.

Die kannst du über den Mac App Store installieren: Xcode im Mac App Store Nicht wundern, Xcode dauert meist Stunden bis es komplett installiert ist.

Außerdem brauchen wir für iOS noch CocoaPods. Das kannst du ebenfalls über Homebrew installieren:

brew install cocoapods

Danach nur noch diese Zeile ausführen um xcode zu konfigurieren:

sudo xcode-select --switch /Applications/Xcode.app/Contents/Developer
sudo xcodebuild -runFirstLaunch

Erste Flutter App erstellen

Nachdem Flutter erfolgreich installiert ist, teste die Installation mit einer Test-App:

fvm flutter create my_first_app
cd my_first_app
fvm flutter run

Flutter Umgebungsvariablen setzen (optional)

Falls du fvm flutter zu umständlich findest, kannst du auch die Umgebungsvariable setzen, damit flutter direkt funktioniert.

Der Pfad zu deiner FVM Flutter Version kann hier variieren, je nachdem wo du FVM installiert hast. Füge folgende Zeile zu deiner ~/.bashrc, ~/.zshrc oder ~/.profile Datei hinzu.

export PATH="$PATH":"$HOME/fvm/default/bin"

Danach kannst du einfach flutter im Terminal nutzen, ohne fvm davor schreiben zu müssen.

Nächste Schritte

Nach erfolgreicher Installation empfehle ich:

  1. IDE einrichten: Installiere VS Code oder Android Studio mit Flutter Plugin
  2. Flutter Basics lernen: Gehe die offiziellen Flutter Codelabs durch oder schau dir andere Blog Artikel von mir an
  3. Hot Reload testen: Ändere etwas in deiner Test-App und speichere - Flutter lädt die App automatisch neu
  4. Erstes Widget erstellen: Erstelle dein erstes Custom Widget

Fazit

Flutter ist auf allen drei Plattformen relativ einfach zu installieren. Der flutter doctor Befehl ist dein bester Freund - er zeigt dir genau, was noch fehlt oder konfiguriert werden muss.

Hast du Probleme bei der Installation? Schreib mir gerne eine Nachricht!

Weiterführende Artikel:

Zurück zum Blog