Flutter 开发环境搭建-VS Code篇

1.准备环境

  • Java SDK 下载及安装
  • Flutter SDK 安装及配置环境变量 下载地址
  • 将flutter sdk解压目录下的bin目录放到系统环境变量中

检查环境,在系统终端中输入:

bash 复制代码
# 打印flutter sdk版本号
flutter --version

# 检查flutter运行环境
flutter doctor

第一次运行可能会出现部分工具没有安装。

  • Android Studio安装
  • Dart 和 Flutter插件安装(Flutter会自动安装Dart插件)

2.Android Studio 开发环境搭建

2.1 Android Studio新建Flutter

在Plugins中安装了Flutter插件后,新建项目选择新建 Flutter project,再次选择Flutter Application,等待一会即可生成项目。

2.2 安装AVD虚拟机

项目生成后需要安装AVD虚拟机,用于测试我们的应用程序,先安装虚拟机:

选择设备型号:

选择Android 版本,可以选择相对高的版本或指定版本:

设置虚拟机名称方便区分多个虚拟机:

3. VSCode中搭建开发环境

对于前端开发来讲 Android Studio可能用不习惯,可以使用VSCode来开发。

3.1 VSCode安装Flutter和Dart插件

安装Flutter一般会自动安装Dart插件。

3.2 VSCode安装和启用虚拟机

状态栏下面选择设备:

3.3 VSCode新建Flutter项目并运行

在终端中使用命令行可以创建flutter项目:

bash 复制代码
flutter create [项目名]

在项目根目录执行命令:

bash 复制代码
# flutter运行到虚拟机
flutter run

虚拟机运行效果:

相关推荐
程序员老刘6 小时前
跑分第一的编程大模型,我为啥不用?
flutter·ai编程·vibecoding
方白羽15 小时前
Android Gradle 缓存与文件目录深度解析
android·gradle·android studio
曲幽18 小时前
Termux里的二进制和脚本,到底怎么运行才不踩坑?Termux-service 保活妙招!
android·termux·nohup·services·wake-lock
plainGeekDev19 小时前
单例模式 → object 声明
android·java·kotlin
程序员陆业聪20 小时前
读者点单·03|Compose 与传统 View 混用的 12 个真实坑
android
程序员陆业聪20 小时前
读者点单·02|Android 启动优化实战:Trace 抓取→Application 编排→冷启动全流程拆解
android
Coffeeee20 小时前
帮你快速理解AI Agent之我想招个Android实习生
android·人工智能·agent
恋猫de小郭21 小时前
苹果 AirPods 协议,Android 也可以使用完整版 AirPods 能力
android·前端·flutter
黄林晴21 小时前
告别无效重建:Gradle 9.6.0 解决 CI 构建缓存失效痛点告别无效重建:Gradle 9.6.0 解决 CI 建筑缓存失效痛点
android·gradle
张风捷特烈1 天前
Flutter 类库大揭秘#01 | path_provider架构与设计
android·flutter