编辑工具设定

你可以使用任意文本编辑器,结合我们的命令行工具来开发 Flutter 应用。 Flutter 团队推荐使用支持 Flutter 插件的编辑器,以获取更好的开发体验。这些插件提供了代码补全、代码高亮、widget 辅助编辑的功能,以及为项目的运行和调试提供支持等。

你可以为 Visual Studio Code、Android Studio 以及 IntelliJ IDEA(Community、Educational、Ultimate 版)添加编辑器支持的插件。 Flutter 插件 适用于 Android Studio 和 IntelliJ IDEA 所列的版本。

Dart 插件 支持另外八个 JetBrains IDE。)

参考以下步骤为 VS Code、Android Studio 或者 IntelliJ 添加编辑器插件。

如果你想使用其他的编辑器,请前往 下一节: 开发体验初探

安装 VS Code

VS Code 是一个可以运行和调试 Flutter 的编辑器。安装 Flutter 插件后,你可以编译、部署及调试 Flutter 应用。

请参考 Microsoft 针对不同平台的安装指引来安装最新版本的 VS Code:

安装 VS Code 的 Flutter 扩展

  1. 打开 VS Code

  2. 打开浏览器,访问市场的 Flutter 插件 页面。

  3. 点击 Install,安装 Flutter 与 Dart 依赖。

验证 VS Code 的设置

  1. 打开 查看 (View) > 命令面板 (Command Palette…)

    你也可以按下 Ctrl / Cmd + Shift + P

  2. 输入 doctor

  3. 选择 Flutter: Run Flutter Doctor。输出结果会显示在 输出 (Output) 面板中。

    选择该指令后,VS Code 会执行以下操作。

    • 打开 输出 (Output) 面板。

    • 在此面板右上方的下拉菜单中选择 flutter (flutter)

    • 显示 Flutter Doctor 指令的输出内容。

安装 Android Studio 或 IntelliJ IDEA

Android Studio 和 IntelliJ IDEA 为 Flutter 提供了一个完整的集成开发环境。

你可以按照以下指引安装对应 IDE 的最新版本:

安装 Flutter 和 Dart 插件

请参考下面不同平台的安装指南:

macOS

安装过程如下:

  1. 打开 Android Studio 或 IntelliJ。

  2. 从 macOS 的菜单栏中打开插件设置。

    你也可以按下 Cmd + ,

    Preferences 弹窗会打开。

  3. 在左侧列表中选择 Plugins

  4. 在面板的上方选择 Marketplace

  5. 在搜索框中输入 flutter

  6. 选择 Flutter 插件。

  7. 点击 Install 安装。

  8. 提示安装时点击确认。如果提示同时安装 Dart 插件也点击确认。

  9. 当弹出重新启动提示时,点击 Restart

Linux 或者 Windows 平台

参考使用下面介绍的步骤:

  1. 打开 File > Settings

    你也可以按下 Cmd + ,

    Preferences 弹窗会打开。

  2. 在左侧列表中选择 Plugins

  3. 在面板的上方选择 Marketplace

  4. 在搜索框中输入 flutter

  5. 选择 Flutter 插件。

  6. 点击 Install 安装。

  7. 提示安装时点击确认。如果提示同时安装 Dart 插件也点击确认。

  8. 当弹出重新启动提示时,点击 Restart