在 VSCode 中搭建 Flutter 开发环境并运行项目

要在 Visual Studio Code (VSCode) 中运行 Flutter 项目并启动虚拟机(例如 Android Emulator),可以按照以下步骤进行设置和操作:

一、安装 Flutter 和 Dart 插件

  1. 安装 Flutter SDK:

    • 前往 Flutter 官网 下载并安装 Flutter SDK,按照操作系统的指引完成安装。
    • 将 Flutter SDK 的 bin 目录添加到系统的 PATH 环境变量中。
  2. 安装 Dart SDK:

    • Dart SDK 通常包含在 Flutter SDK 中,因此安装 Flutter 后不需要单独安装 Dart SDK。
  3. 安装 VSCode 插件:

    • 打开 VSCode,进入扩展市场(可以按 Ctrl+Shift+X)。
    • 搜索 Flutter 插件并安装。
    • 这将同时安装 Dart 插件,因为 Dart 插件是 Flutter 插件的依赖项。

二、安装 Android Studio 和配置 Android 模拟器

  1. 安装 Android Studio:

    • 前往 Android Studio 官网 下载并安装 Android Studio。
    • 安装过程中勾选安装 Android SDK、Android SDK 命令行工具,以及相关的构建工具。
  2. 配置 Android 模拟器:

    • 打开 Android Studio,进入 AVD Manager(Android Virtual Device Manager)。
    • 创建一个新的虚拟设备(AVD),选择你需要的设备类型和系统镜像(推荐使用 x86 镜像以获得更好的性能)。
    • 完成配置并启动虚拟设备以确保其正常工作。

三、在 VSCode 中运行 Flutter 项目

  1. 创建新的 Flutter 项目:

    • 打开 VSCode,按 Ctrl+Shift+P 打开命令面板。
    • 输入 Flutter: New Project,选择 Flutter: New Project 并按提示创建新的 Flutter 项目。
  2. 运行 Flutter 项目:

    • 在 VSCode 中打开你创建的 Flutter 项目。

    • 打开终端(可以按 Ctrl+ `)。

    • 启动 Android 模拟器,可以通过以下命令启动:

      sh 复制代码
      emulator -avd <Your_AVD_Name>

      或者在 VSCode 的底部工具栏中,选择设备下拉列表,然后选择你的虚拟设备。

    • 确保模拟器正在运行。

    • 在 VSCode 中,按 F5 或者在命令面板中输入 Flutter: Run 以启动项目。

四、配置设备和调试选项

  1. 选择设备:

    • 如果你有多个设备(例如物理设备和模拟器),可以在 VSCode 底部的状态栏中选择你希望运行的设备。
  2. 调试选项:

    • VSCode 中的调试控制台可以提供丰富的调试功能,包括设置断点、检查变量、查看调试日志等。按 F5 启动调试模式。
相关推荐
一只大侠的侠14 小时前
Flutter开源鸿蒙跨平台训练营 Day 10特惠推荐数据的获取与渲染
flutter·开源·harmonyos
renke336417 小时前
Flutter for OpenHarmony:色彩捕手——基于HSL色轮与感知色差的交互式色觉训练系统
flutter
子春一19 小时前
Flutter for OpenHarmony:构建一个 Flutter 四色猜谜游戏,深入解析密码逻辑、反馈算法与经典益智游戏重构
算法·flutter·游戏
铅笔侠_小龙虾20 小时前
Flutter 实战: 计算器
开发语言·javascript·flutter
微祎_1 天前
Flutter for OpenHarmony:构建一个 Flutter 重力弹球游戏,2D 物理引擎、手势交互与关卡设计的工程实现
flutter·游戏·交互
一起养小猫1 天前
Flutter for OpenHarmony 实战_魔方应用UI设计与交互优化
flutter·ui·交互·harmonyos
hudawei9961 天前
flutter和Android动画的对比
android·flutter·动画
一只大侠的侠1 天前
Flutter开源鸿蒙跨平台训练营 Day7Flutter+ArkTS双方案实现轮播图+搜索框+导航组件
flutter·开源·harmonyos
一只大侠的侠1 天前
Flutter开源鸿蒙跨平台训练营 Day9分类数据的获取与渲染实现
flutter·开源·harmonyos
先跑起来再说1 天前
Git 入门到实战:一篇搞懂安装、命令、远程仓库与 IDEA 集成
ide·git·后端·elasticsearch·golang·intellij-idea