Flutter has been gained big popularity in the last few years, and today I'm going to show you the must-have Vscode Extensions to work comfortably with it and to multiply your productivity, so without any further words let go into it!
1-Flutter :
This VS Code extension adds support for effectively editing, refactoring, running, and reloading Flutter mobile apps, as well as support for the Dart programming language.
2-Dart :
Dart Code extends VS Code with support for the Dart programming language and provides tools for effectively editing, refactoring, running, and reloading Flutter mobile apps, and AngularDart web apps.
3-Better Comments:
Better Comments
The Better Comments extension will help you create more human-friendly comments in your code.
With this extension, you will be able to categorize your annotations into:
- Alerts
- Queries
- TODOs
- Highlights
Commented out code can also be styled to make it clear the code shouldn't be there
Any other comment styles you'd like can be specified in the settings.
4-Bracket Pair Colorizer 2:
This extension allows matching brackets to be identified with colors. The user can define which tokens to match, and which colors to use
5-Dart Data Class Generator:
Create dart data classes easily, fast, and without writing boilerplate or running code generation.
6- Gradle Language Support:
An extension to provide Gradle language support for Visual Studio Code, including advanced functionalities like Syntax Highlighting, Keyword Auto-completion Proposals, and Duplication Validation.
7-Material Icon Theme: an extension to get the Material Design icons into your VS Code.
8-Pubspec Assist:
Pubspec Assist is a Visual Studio Code extension that allows you to easily add dependencies to your Dart and Flutter project's pubspec.yaml, all without leaving your editor.
9-Awesome Flutter Snippets:
Awesome Flutter Snippets is a collection of commonly used Flutter classes and methods. It increases your speed of development by eliminating most of the boilerplate code associated with creating a widget
10- Error Lens:
ErrorLens turbo-charges language diagnostic features by making diagnostics stand out more prominently, highlighting the entire line wherever a diagnostic is generated by the language and also prints the message inline.
Did I miss any extensions? Let me know in the comments.
If you find this useful give it a like and don't forget to follow me on Instagram and on my Blog for more useful stuff about flutter.
Top comments (10)
Thanks for the list :) Since Bracket Pair Colorizer 2 is in the list I might share mine as well :P Since it makes coding any programming language easier :D So here it is :) I've just released a new version.
🔥A simple yet powerful extension to add wrapper templates around your code blocks
Surround
A simple yet powerful extension to add wrapper snippets around your code blocks
Features
Demo 1: Choosing a wrapper snippet from quick pick menu
Demo 2: Wrapping multi selections
How To Use
After selecting the code block, you can
to get list of commands and pick one of them.
List of commands
surround.with(ctrl+shift+T)surround.with.ifsurround.with.ifElseCheers, 🚀🖖
A star on Github added!
Thank you very much :)) Cheers,
Thanks for Sharing! I would be glad to use it for sure.
Many of the classic ones I already know, but a nice and compact overview for Flutter beginners! 👍
But even I have found a new gem, Error Lens, which I hadn't heard of before and will enhance my workflow from now on. Thanks! 😊
you're welcome!
wow, that's awesome! I really like it! if you are interested in this topic, then check this article - dev.to/pablonax/free-flutter-templ...
Anyone know if you can create a vscode extension in Dart / with Flutter?
Kindly check the below extenstion,
marketplace.visualstudio.com/items...