Flutter in VSCode - Die Plugins

Flutter in VSCode - Die Plugins

Als Entwickler hat man oft die Qual der Wahl: welche Tools nutzt man? Womit kann man am besten Arbeiten? Welche Tools lassen sich so personalisieren, dass sie für den Workflow passen?

Meine Entscheidung fällt in Sachen IDE / Editor immer wieder auf Visual Studio Code zurück. Der kostenlose Editor von Microsoft ist durch sein umfangreiches Portfolio an Erweiterungen, welche sowohl von Microsoft als auch durch die Community bereitgestellt werden, ein wirklich starkes Tool das sich sehr einfach an seine eigenen Bedürfnisse und Workflows anpassen lässt. Egal ob Webentwicklung, Python oder die Programmierung von Arduinos, die Electron basierte Anwendung kann einfach alles (wenn auch mit ordentlichem Ressourcenhunger!).

So war für mich die Entscheidung, womit ich meine Flutter Anwendungen entwickle, recht schnell gefällt. Als Alternative stand Android Studio im Raum, jedoch bin ich (Asche auf mein Haupt) kein Fan von den JetBrains Produkten. Jedoch ist auch VSCode ohne Plugins eben nur ein weiterer Editor. Die volle Leistungsfähigkeit wird erst durch das großartige Pluginsystem entfesselt. Nachfolgend möchte ich meine, für die Flutter Entwicklung wichtigsten, Plugins vorstellen.


Dart und Flutter von DartCode - https://dartcode.org/
Die Erweiterungen von DartCode sorgt für grundlegende Funktionen im Umgang mit Dart, der Sprache in der Apps mit Flutter geschrieben werden, und Flutter selbst. Sie bieten Keybindings für häufig genutzte Funktionen wie "Dokument formatieren" (CTRL/CMD + Shift + F) oder aber "Code Completion" (CTRL + Space).

Außerdem werden komfortable Features wie das Starten von Simulatoren und Emulatoren direkt in die Oberfläche von VSCode integriert.


Dart-Import von Luan
Während der Arbeit mit Dart und Flutter greift man, wie in jeder anderen Sprache und jedem Framework auch, auf unterschiedliche Klassen zurück, die zunächst importiert werden müssen. Der Import läuft immer nach dem selben Schema ab: man schreibt Code der auf einer nicht importierten Klasse basiert, VSCode unterstreicht die fehlende Klasse, dart-code importiert ihn. Er wird jedoch immer über die "package-Syntax" importiert. Gemäß Styleguide sollen alle Dateien die innerhalb des Ordners /lib liegen, jedoch über relative Importe geladen werden, um so eine Trennung zwischen eigenem und "externem" Code zu erreichen. Genau hier kommt dart-import ins Spiel

dart-import - Visual Studio Marketplace
Extension for Visual Studio Code - Fix Dart/Flutter’s imports

Das Plugin sorgt dafür, dass alle Importe automatisch ins korrekt Format gebracht werden.


Pascal Friedrich

Softwareentwickler mit dem Schwerpunkt mobile Apps und Internet of Things. Begeistert von den Möglichkeiten eines Arduinos, Fan von Flutter.