移动应用程序开发非常困难且耗时，以至于我们的开发人员浪费时间导入库或不得不手动重新格式化dart文件。
在本文中，我们将介绍一些VSCode插件，这些插件可以极大地改善我们的工作流程，并帮助我们减少浪费在无聊和重复性任务上的时间，这些任务加在一起会占用我们大量的时间和工作效率。
所以，不用多说，让我们开始第一个扩展。
Flutter and Dart
我们从一个明显但至关重要的开始，这些是您第一次设置Flutter环境时可能已经安装的插件。Flutter插件增加了对Dart的编辑和重构，运行和重新加载flutter应用程序的支持。
我建议你进入设置并启用Dart：Preview Flutter Ui Guides选项。这样可以很容易地发现代码中的父子关系，这在UI文件中有许多嵌套小部件时尤其有用。
此插件程序允许您执行的另一件事是通过按⌘ + .可访问的菜单执行多个有用的操作。（在Windows和Linux上使用ctrl +.）
关于Dart的插件，它基本上增加了对Dart编程语言，语法高亮和代码完成的支持。
Bracket Pair Colorizer 2
在Flutter中，我们经常处理大量的括号。当您开始嵌套小部件时，很难以快速简便的方式发现支架对。只需使用Bracket Pair Colorizer 2即可提高代码的可读性。
Pubspec Assist
我开始使用flutter时遇到的主要挫折之一是导入并保持包更新。每次我需要更新包时，我都必须去pub.dev，搜索包，转到安装选项卡并复制/粘贴一行代码。正如我在本文的介绍中所提到的，我们不能浪费时间在这些事情上。
这就是名为pubspec assist的扩展开始发挥作用的地方。所有你需要做的就是打开你的pubspec.yaml文件，打开命令面板，选择“pubspec assist：add dependency”并输入你需要的依赖项的名称。您将自动将其添加到pubspec.yaml文件中，更新到最新版本，所有这些都不会留下代码。以下gif将更好地解释它。
Material Icon Theme
我们IDE的主题经常被低估。它不仅仅是一种审美特征。它实际上帮助我们更快地找到文件和文件夹的方式。谈到VS Code，我选择的主题是Philipp Kief的Material Icon主题。它拥有丰富的彩色，美观图标。
更好的注释
代码注释通常可用于将笔记留给在我们团队工作的其他开发人员或未来的自我。我经常使用很多TODO来提醒自己重新开始这些东西并重构一下。好吧，更好的评论对我有很大帮助。它允许我们根据类型对我们的评论进行分类。例如：
Todo tree
说到TODO，Gruntfuggly的Todo Tree是我工作中最喜欢的插件之一，不仅是在Flutter，而且在VS Code中。它在您的代码中搜索TODO和FIXME标记，并在浏览器窗格中方便的树视图中显示这些注释，允许您在单击时直接转到该注释。一个简单但功能强大的扩展，可以节省我很多时间来寻找代码周围的待机。
Color Highlight
Sergii Naumov的颜色突出显示有助于构建UI并存储颜色变量以快速识别十六进制值所指的颜色。Color Highlight提供不同的标记类型。
在图像中有我选择的标记，即“背景”。您可以在扩展程序的设置中更改以下标记：dot-before，dot-after，foreground，outline和underline。非常简洁，可以更快速有效地构建UI。
Image Preview
KissTamás的图像预览对于我们Flutter开发人员来说尤其有用。我们应用程序体验的一个关键部分是图像。图片使应用更吸引用户。但是你可能知道，在Flutter中导入图像有点痛苦。您必须在目录中导入它们，并且每次要使用它时都使用路径String来引用图像，智能感觉也无济于事。图像预览允许我们至少预览我们在代码行左侧写入路径的图像。与Android Studio和Intellij非常相似，包括图像和颜色。
最重要的是，如果将鼠标悬停在路径String上，则扩展程序会显示一个链接，以获取项目结构中的文件及其尺寸。
结论
这就是我对Flutter的顶级VSCode插件的选择。所有这些插件，由于他们伟大的创造者帮助我和许多其他开发人员，以更快，更愉快的方式完成他们的工作。
我希望你喜欢这篇文章，如果你有更多的插件，你认为对我和其他开发者有用，请在回复本文时写下它们，可能需要快速描述。让我们改进彼此的工作流程！
翻译自：https://medium.com/flutter-community/must-have-vs-code-extensions-for-working-with-flutter-e31a421b9c68