Vscode配置Flutter开发(Windows)

1.安装JDK开发包

我们需要Android SDK来创建Android模拟器,而运行Android SDK命令行工具需要依赖JDK,所以先安装JDK依赖。

1.1在哪下载

在华为镜像repo.huaweicloud.com/java/jdk/,下载jdk1.8版本的开发包。

安装jdk包之后,配置jdk的环境变量,这里以window环境为例子,添加以下环境变量

ini 复制代码
JAVA_HOME=D:\utils\android\jdk_1.8\bin // 值为jdk安装的路径
CLASSPATH=.;%JAVA_HOME%\lib\dt.jar;%JAVA_HOME%\lib\tools.jar;
path=%JAVA_HOME%\bin; %JAVA_HOME%\jre\bin

1.2 验证jdk环境是否配置成功

在命令行中键入java -version命令,出现java版本即配置成功

2.用命令行工具搭建Android环境

2.1下载命令行工具

在Android Studio官网developer.android.com/studio下载命令行工具,拉到底部即可看到

解压下载好的命令行工具到专门存放Android相关资料的目录中,这里我使用的是D:\utils\android\sdk,修改一下解压后的目录名:

ini 复制代码
# 这里修改目录名防止执行sdk命令行命令报错
# see: https://stackoverflow.com/questions/65262340/cmdline-tools-could-not-determine-sdk-root
commandlinetools-win-9123335_latest\cmdline-tools=>commandlinetools-win-9123335_latest\tools
# 下面的不改也可以,这里是为了让目录简短些
commandlinetools-win-9123335_latest\tools=>cmdline-tools\tools

将sdk命令行工具加入到环境变量

makefile 复制代码
D:\utils\android\sdk\cmdline-tools\tools
D:\utils\android\sdk\cmdline-tools\tools\bin

2.2下载基础工具包

使用sdkmanager --list查看可以下载的包,这里安装以下工具包

css 复制代码
sdkmanager --install cmdline-tools;latest platform-tools

安装完成之后,添加以下路径到环境变量中

makefile 复制代码
D:\utils\android\sdk\cmdline-tools\latest\bin
D:\utils\android\sdk\platform-tools

3.通过命令行工具下载Android SDK

在安卓开发者官网developer.android.google.cn/guide/topic...上查看需要使用到的API级别下载对应级别的SDK,这里使用Android 12,对应级别为32。安装命令如下:

css 复制代码
sdkmanager --install build-tools;32.0.0 platforms;android-32

4.通过命令行工具下载仿真镜像和模拟器

上一步使用的是api级别32的sdk,这里通过sdkmanager --list命令查看对应的仿真包,选择一个安装

css 复制代码
sdkmanager --install emulator system-images;android-32;google_apis_playstore;x86_64

5.Vscode中配置Flutter插件

在插件应用市场搜索Flutter并安装后,键入ctrl+shift+P快捷键,输入Flutter,选择Flutter:Select Device

然后再选择Create Android emulator就可以启动Android模拟器啦。

参考链接

相关推荐
君蓦12 小时前
Flutter 本地存储与数据库的使用和优化
flutter
problc1 天前
Flutter中文字体设置指南:打造个性化的应用体验
android·javascript·flutter
lqj_本人1 天前
鸿蒙next选择 Flutter 开发跨平台应用的原因
flutter·华为·harmonyos
lqj_本人1 天前
Flutter&鸿蒙next 状态管理框架对比分析
flutter·华为·harmonyos
起司锅仔2 天前
Flutter启动流程(2)
flutter
hello world smile2 天前
最全的Flutter中pubspec.yaml及其yaml 语法的使用说明
android·前端·javascript·flutter·dart·yaml·pubspec.yaml
lqj_本人2 天前
Flutter 的 Widget 概述与常用 Widgets 与鸿蒙 Next 的对比
flutter·harmonyos
iFlyCai2 天前
极简实现酷炫动效:Flutter隐式动画指南第二篇之一些酷炫的隐式动画效果
flutter
lqj_本人2 天前
Flutter&鸿蒙next 中使用 MobX 进行状态管理
flutter·华为·harmonyos