vscode+ flutter+android studio开发环境搭建

最新推荐文章于 2024-06-07 18:39:13 发布
最新推荐文章于 2024-06-07 18:39:13 发布
阅读量3.9k 收藏 2
点赞数 2
分类专栏： Flutter 文章标签： flutter
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/webofrxy/article/details/90217445
版权

环境要求

由于Flutter SDK和Android Studio以及后续安卓模拟器体积很大，所以建议C盘的空间至少要有10G以上的可用空间。

下载Flutter SDK

进入Flutter官网下载最新版本的Flutter SDK，如果遇到网络问题，请百度解决。
１.png

２.png
下载完成后，解压得到下面的文件夹，为了避免windows环境下的路径问题，所以我把flutter文件夹解压到了C盘根目录下。
flutter-sdk.png
将flutter sdk 放到C盘后，打开CMD，执行flutter doctor
检测flutter 环境是否正常，从下图可知，我这边的flutter版本是v1.2.1的版本。由于我这边Android Studio、安卓模拟器和VSCode的环境已经配置好了，所以都是显示绿色的对勾。
flutter-doctor.png
创建一个新的flutter项目
image.png

配置VSCode环境

Vscode是微软出品的轻量级编辑器，前端必备。使用vscode开发flutter需要安装专门的Flutter插件，安装方式如下图：打开扩展–>搜索flutter–>点击绿色安装按钮（该插件会将flutter和dart所需环境配置好）
flutter-vscode.png
flutter-plugin.png

安装Android Studio

进入官网下载最新版的Android Studio，由于我的电脑系统是window 10 ，所以显示的下载版本是windows的版本。
Android-studio.png
点击file–>setting–>plugin，安装Android studio 中的flutter和Dart扩展
setting.png
Android-plugin.png
安装完成后打开创建的flutter项目，Android studio 会自动加载相关文件
flutter项目结构.png
启动安卓模拟器
image.png
image.png
４.png

图解前端
关注
  • 2
    点赞
  • 踩
  • 2
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
专栏目录
vscode配置android sdk,windows + flutter +android+ vscode 安装配置运行流程（详细版本）...
weixin_35245810的博客
05-29 2339
flutter是由谷歌发布的一个全新的响应式、跨平台、高性能的移动开发框架，可以快速在iOS和Android上构建高质量的原生用户界面。框架特点快速开发：Flutter的热重载可以快速地进行测试、构建UI、添加功能并更快地修复错误。富有表现力，漂亮的用户界面：自带的Material Design和Cupertino(iOS风格)widget、丰富的motion API、平滑而自然的滑动效果。响应式...
VScode搭建Flutter+dart+模拟器开发安卓App
weixin_44334099的博客
12-07 5346
VScode搭建Flutter+dart+模拟器开发安卓AppFlutterSDK&&Dart环境&&JDKFlutterJDK安装下载Android Studio（也可单独安装AndroidSDK）VScode配置 FlutterSDK&&Dart环境&&JDK 第一次写博客欢迎留言 Flutter 官网下载最新版Flutter：https://flutterchina.club/setup-windows/ 最新版本Flutter集成了Da
安装Flutter + Android sdk + vs code运行Flutter项目（史上最详解）
01-03
前言： Flutter开发app是基于Dart语言开发的，就好比html网页开发基于JavaScript一样，而浏览器内核都可以编译JavaScript代码，所有开发html网页不需要下载啥SDK,直接在浏览器就能运行。首先我们安装Dart语言的SDK，便于运行Flutter开发的app 步骤如下： 安装Dart 安装java的JDK （需配置环境变量） 下载Flutter SDK （需配置环境变量） 安装Android Studio （为了下载Android sdk，官方提供的方法） 创建第一个Flutter项目 并运行 下面是我安装Flutter的全套安装包： 链接: https://pa
在 VSCode 中搭建 Flutter 开发环境并运行项目
最新发布
Chloeeeeeeee的博客
06-07 2990
在 VSCode 中运行 Flutter 项目并启动虚拟机的步骤如下：首先，安装 Flutter SDK 并添加其 bin 目录到系统 PATH，然后在 VSCode 中安装 Flutter 和 Dart 插件。接着，下载并安装 Android Studio，配置 Android 模拟器。创建 Flutter 项目后，打开终端启动模拟器，或通过 VSCode 工具栏选择设备，按 F5 运行项目。最后，使用调试控制台设置断点和检查变量，进行调试。这样即可在 VSCode 中运行和调试 Flutter 项目。
VSCode配置Flutter模拟器
热门推荐
手写我对你的温柔
08-23 1万+
以前写过一篇文章https://blog.csdn.net/qq_39969226/article/details/88824118可以用bat文件管理我们的Android 模拟器。 在VSCode上开发Flutter,主要是考虑到VSCode没有AndroidStudio那么消耗内存. 怎么不用之前讲过的.bat启动呢？ 用VSCode的插件： 最推荐的方法： 在Andro...
解决Android Studio或VSCode中连接不到第三方模拟器
niupiclass的博客
06-04 9085
Flutter中启动第三方模拟器 1.先打开夜神模拟器 2.win+R选择cmd进入第三方模拟器的安装目录的bin目录下 1.夜神模拟器 D:\Program Files\Nox\bin 然后运行命令： nox_adb.exe connect 127.0.0.1:62001 2.逍遥模拟器 D:\Program Files\Microvirt\MEmu 然后运行命令： adb connect 1...
Flutter——Android Studio下环境配置
01-03
那么，我们就来讲讲如何配置 Android Studio+ Flutter的开发环境。 一、安装 Flutter SDK 首先，新增两个系统变量，主要用于后期 Flutter检测时的安装，此电脑->属性->高级->环境变量。 export PUB_HOSTED_URL=...
Android Studio 下 Flutter 开发环境搭建,Flutter,Dart 插件安装,Flutter SDK 安装,环境变量配置,开发环境检查
08-19
在开始搭建环境之前，建议先熟悉一下Flutter的基础知识和资源： 1. **官方文档**：https://flutter.dev/docs，这里是Flutter的官方文档，包含全面的指南、教程和API参考。 2. **Flutter for Android Developers**：...
Android Studio下Flutter环境搭建图文教程
01-05
一、Flutter介绍 ...插件，并下载flutterSdk到本地，配置在环境变量即可，其实 中⽂⽹的搭建Futter开发环境 已经很贴⼼详细，从平台指引开始安装基本都不会遇到问题。 1.下载AndroidStudio中的插件 Dart和Flut
Flutter 通过 VS code 连接 Android 模拟器（Windows）
Stark6的博客
04-20 3385
最近需要学习 Flutter 进行混合开发，配置信息比较容易忘记，在这里记录一下。
AndroidStudio：连接第三方模拟器
selectDele的博客
12-18 2478
1.连接android的sdk， 首先要先找到，这个sdk不是自带的，怎么找？（我布吉岛），studio里面可以下载的 拷贝一下路径 右击此电脑-属性-高级系统设置-环境变量-path-（编辑-粘贴） 2.连接 打开AndroidStudio左下角找到这个 重点 在上面命令行中输入连接的命令 mumu模拟器：adb connect 127.0.0.1:7555 海马玩模拟器：a...
vscode 配置 连接模拟器_VSCode得心应手——VSCode 连接与通用配置
weixin_31119221的博客
01-26 4702
这是VSCode得心应手教程的第二部分，介绍 VSCode 如何远程连接到虚拟机，以及最关键的 VSCode 通用开发配置。VSCode 连接虚拟机在 VSCode 应用商店上安装一个插件：Remote - SSH。然后：步骤三输完回车后，选择 C:\ProgramData\ssh\ssh_config 配置。由于在上一篇文章使用上公钥登陆了，所以正常情况就可以直接登陆到 VMWare ...
vscode使用Android studio模拟器
weixin_67299751的博客
11-22 3570
去往Android studio找到flie -- settings -- Tools -- Emulator -- 默认这个是勾选的，取消勾选，退出编辑器重新启动就好了。最后在补充俩点，都是踩的坑，flutter创建的目录千万不能带中文路径，不然启动项目也会报错。声明：flutter刚开始学，以下是我花了老半天才解决的，遇到相同问题的可以试一试。连接成功后就需要启动项目了，这时候项目就会报一个错。注意：你可以去改版本，但是一定要看里面有没有这个版本，没有的话是一定会失败的。进来往下滑，高版本的都在下面。
flutter环境配置VScode和Android Studio
“明明很开心”的博客空间
04-02 1042
VScode 安装vscode 依据官网下载Windows版本的Flutter SDK 在系统环境变量的path加入Flutter SDK解压后的地址：xxx/flutter/bin 打开vscode在“扩展”中搜索安装Flutter和Dart 打开命令行（git bash或其他）输入flutter devices，查看里面连接的设备是否有Chrome，里面可能有几种设备 “Ctrl+Shift+P”，打开输入flutter选择new，如下图 按指引选择文件项目存放地址，就新建
Mac电脑Android Studio和VS Code配置Flutter开发环境（图文超详细）
Gamin
10-30 6009
​ 官网地址： https://docs.flutter.dev/get-started/install/macos 注意：苹果芯片需要安装rosetta翻译环境 Flutter用于git安装和升级。我们建议安装Xcode，其中包含git，但您也可以单独安装git。
开发工具：VsCode+AndroidStudio
shizhong2006的专栏
12-04 1115
VsCode 怎么查看已安装的应用 vscode怎样在仓库里使用git命令 studio 调试adb
在Windows上搭建Flutter开发环境及在VScode和android studio中运行
Mini_小仙女的博客
03-24 426
Flutter环境安装和配置android studio 配置功能快捷键合理的创建标题，有助于目录的生成如何改变文本的样式插入链接与图片如何插入一段漂亮的代码片生成一个适合你的列表创建一个表格设定内容居中、居左、居右SmartyPants创建一个自定义列表如何创建一个注脚注释也是必不可少的KaTeX数学公式新的甘特图功能，丰富你的文章UML 图表FLowchart流程图导出与导入导出导入 你好！ 这是你第一次使用 Markdown编辑器 所展示的欢迎页。如果你想学习如何使用Markdown编辑器, 可以仔细
IDEA/AndroidStudio/VSCode插件开发--lottie-svga-player
Android_杜小菜_移动开发技术专栏
10-15 743
基于最新版Android Studio/IDEA/VSCode开发的各种实用而有趣的插件，plugin包括Lottie/SVGA Player，兼容多个平台。
vscode配置flutter开发环境，不需要安装第三方安卓模拟器
tyeerth的博客
05-28 1万+
vscode配置flutter开发环境，使用Android studio自带的安卓模拟器，不需要安装第三方模拟器，即可实现vscode代码实时调试(热加载）
vscode配置flutter开发环境
06-08
好的，下面是配置步骤： 1.首先，你需要下载安装 Flutter SDK，可以到官网 https://flutter.dev/docs/get-started/install 下载对应系统版本的安装包...以上就是 VS Code 配置 Flutter 开发环境的步骤，希望能帮到你。
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值