win11+vscode+Flutter 开发环境配置

2024-09-02 00:20

本文主要是介绍win11+vscode+Flutter 开发环境配置,希望对大家解决编程问题提供一定的参考价值,需要的开发者们随着小编来一起学习吧!

https://blog.csdn.net/Oven_maizi/article/details/126804404

1 vscode插件 安装

安装红框中的两个

2 flutter sdk 安装

dart sdk 包含在flutter sdk 里面,路径:flutter_windows_3.24.1-stable\flutter\bin\cache\dart-sdk

方式1:

通过vscode安装Flutter插件后,ctrl+shift+p 输入flutter,vscode的右下角会提示安装Flutter sdk

方式2:

​​​​​​​版本列表 | Flutter 中文文档 - Flutter 中文开发者网站 - Flutter

方式3:

下载源码到一个目录,添加它的bin目录路径到 环境变量 中

git clone https://github.com/flutter/flutter.git

3 新建一个 flutter 项目

新建Flutter项目后,可以在lib目录通过终端去执行演示程序

4 演示程序执行前 flutter doctor 检查

首次运行 flutter doctor 报的错误,可以看到报错提示,安卓开发、win开发 还缺少依赖,但

web开发是可以的,那么只需要解决 网络资源不可用问题

PS E:\workspace\test_drive\flutter_application_1\lib> flutter doctor
Doctor summary (to see all details, run flutter doctor -v):
[√] Flutter (Channel stable, 3.24.1, on Microsoft Windows [版本 10.0.22631.4037], locale zh-CN)
[√] Windows Version (Installed version of Windows is version 10 or higher)
[X] Android toolchain - develop for Android devicesX Unable to locate Android SDK.Install Android Studio from: https://developer.android.com/studio/index.htmlOn first launch it will assist you in installing the Android SDK components.(or visit https://flutter.dev/to/windows-android-setup for detailed instructions).If the Android SDK has been installed to a custom location, please use`flutter config --android-sdk` to update to that location.[√] Chrome - develop for the web
[X] Visual Studio - develop Windows appsX Visual Studio not installed; this is necessary to develop Windows apps.Download at https://visualstudio.microsoft.com/downloads/.Please install the "Desktop development with C++" workload, including all of its default components
[!] Android Studio (not installed)
[√] Connected device (3 available)
[!] Network resourcesX A network error occurred while checking "https://maven.google.com/": 信号灯超时时间已到! Doctor found issues in 4 categories.

临时解决办法:

在中国网络环境下使用 Flutter | Flutter 中文文档 - Flutter 中文开发者网站 - Flutter

根据上述文档,在powerShell执行下述命令

 $env:PUB_HOSTED_URL="https://pub.flutter-io.cn"$env:FLUTTER_STORAGE_BASE_URL="https://storage.flutter-io.cn"

再次运行  flutter dockor,网络错误已经解决。

PS E:\workspace\test_drive\flutter_application_1\linux> flutter doctor
Flutter assets will be downloaded from https://storage.flutter-io.cn. Make sure you trust this source!
Doctor summary (to see all details, run flutter doctor -v):
[√] Flutter (Channel stable, 3.24.1, on Microsoft Windows [版本 10.0.22631.4037], locale zh-CN)
[√] Windows Version (Installed version of Windows is version 10 or higher)
[X] Android toolchain - develop for Android devicesX Unable to locate Android SDK.Install Android Studio from: https://developer.android.com/studio/index.htmlOn first launch it will assist you in installing the Android SDK components.(or visit https://flutter.dev/to/windows-android-setup for detailed instructions).If the Android SDK has been installed to a custom location, please use`flutter config --android-sdk` to update to that location.[√] Chrome - develop for the web
[X] Visual Studio - develop Windows appsX Visual Studio not installed; this is necessary to develop Windows apps.Download at https://visualstudio.microsoft.com/downloads/.Please install the "Desktop development with C++" workload, including all of its default components
[!] Android Studio (not installed)
[√] Connected device (3 available)
[√] Network resources! Doctor found issues in 3 categories.

最终解决办法:

后面又发现上述命令只是临时修改当前终端的环境变量,还需在 Windows 中永久设置环境变量

验证环境变量是否生效

新启动一个powershell,执行下述代码,回显不为空才对

echo $env:PUB_HOSTED_URL

4 web开发

下载一个谷歌

5 android开发 额外配置

1 下载 android studio 

https://developer.android.com/studio/install?hl=zh-cn#windows

2 android studio 安装包,引导式安装 一路都是默认,目标是安装好下面组件

3 打开android studio,额外安装命令行工具

4. 新建android 虚拟机

5.演示程序运行在安卓平台前检查

5.使用vscode启动安卓虚拟机

这篇关于win11+vscode+Flutter 开发环境配置的文章就介绍到这儿,希望我们推荐的文章对编程师们有所帮助!



http://www.chinasem.cn/article/1128463

相关文章

Android 悬浮窗开发示例((动态权限请求 | 前台服务和通知 | 悬浮窗创建 )

《Android悬浮窗开发示例((动态权限请求|前台服务和通知|悬浮窗创建)》本文介绍了Android悬浮窗的实现效果,包括动态权限请求、前台服务和通知的使用,悬浮窗权限需要动态申请并引导... 目录一、悬浮窗 动态权限请求1、动态请求权限2、悬浮窗权限说明3、检查动态权限4、申请动态权限5、权限设置完毕后

SpringBoot+MyBatis-Flex配置ProxySQL的实现步骤

《SpringBoot+MyBatis-Flex配置ProxySQL的实现步骤》本文主要介绍了SpringBoot+MyBatis-Flex配置ProxySQL的实现步骤,文中通过示例代码介绍的非常详... 目录 目标 步骤 1:确保 ProxySQL 和 mysql 主从同步已正确配置ProxySQL 的

Spring Boot整合log4j2日志配置的详细教程

《SpringBoot整合log4j2日志配置的详细教程》:本文主要介绍SpringBoot项目中整合Log4j2日志框架的步骤和配置,包括常用日志框架的比较、配置参数介绍、Log4j2配置详解... 目录前言一、常用日志框架二、配置参数介绍1. 日志级别2. 输出形式3. 日志格式3.1 PatternL

配置springboot项目动静分离打包分离lib方式

《配置springboot项目动静分离打包分离lib方式》本文介绍了如何将SpringBoot工程中的静态资源和配置文件分离出来,以减少jar包大小,方便修改配置文件,通过在jar包同级目录创建co... 目录前言1、分离配置文件原理2、pom文件配置3、使用package命令打包4、总结前言默认情况下,

在Mysql环境下对数据进行增删改查的操作方法

《在Mysql环境下对数据进行增删改查的操作方法》本文介绍了在MySQL环境下对数据进行增删改查的基本操作,包括插入数据、修改数据、删除数据、数据查询(基本查询、连接查询、聚合函数查询、子查询)等,并... 目录一、插入数据:二、修改数据:三、删除数据:1、delete from 表名;2、truncate

基于Python开发PPTX压缩工具

《基于Python开发PPTX压缩工具》在日常办公中,PPT文件往往因为图片过大而导致文件体积过大,不便于传输和存储,所以本文将使用Python开发一个PPTX压缩工具,需要的可以了解下... 目录引言全部代码环境准备代码结构代码实现运行结果引言在日常办公中,PPT文件往往因为图片过大而导致文件体积过大,

使用DeepSeek API 结合VSCode提升开发效率

《使用DeepSeekAPI结合VSCode提升开发效率》:本文主要介绍DeepSeekAPI与VisualStudioCode(VSCode)结合使用,以提升软件开发效率,具有一定的参考价值... 目录引言准备工作安装必要的 VSCode 扩展配置 DeepSeek API1. 创建 API 请求文件2.

VScode连接远程Linux服务器环境配置图文教程

《VScode连接远程Linux服务器环境配置图文教程》:本文主要介绍如何安装和配置VSCode,包括安装步骤、环境配置(如汉化包、远程SSH连接)、语言包安装(如C/C++插件)等,文中给出了详... 目录一、安装vscode二、环境配置1.中文汉化包2.安装remote-ssh,用于远程连接2.1安装2

vscode保存代码时自动eslint格式化图文教程

《vscode保存代码时自动eslint格式化图文教程》:本文主要介绍vscode保存代码时自动eslint格式化的相关资料,包括打开设置文件并复制特定内容,文中通过代码介绍的非常详细,需要的朋友... 目录1、点击设置2、选择远程--->点击右上角打开设置3、会弹出settings.json文件,将以下内

四种Flutter子页面向父组件传递数据的方法介绍

《四种Flutter子页面向父组件传递数据的方法介绍》在Flutter中,如果父组件需要调用子组件的方法,可以通过常用的四种方式实现,文中的示例代码讲解详细,感兴趣的小伙伴可以跟随小编一起学习一下... 目录方法 1:使用 GlobalKey 和 State 调用子组件方法方法 2:通过回调函数(Callb