『Flutter』开发环境搭建

1.前言

大家好,我是 BNTang,今天给大家介绍一下 Flutter 的开发环境搭建。在之前我已经将 Dart 的基本语法给大家介绍了,所以今天就不再介绍 Dart 的基本语法了,直接进入 Flutter 的开发环境搭建。

2.安装 Java SDK

Java SDK 下载地址:https://www.oracle.com/cn/java/technologies/downloads/#jdk17-windows

配置环境变量:

如上其实就是将 Java SDK 的 bin 目录添加到环境变量中,这样我们就可以在任意目录下使用 Java 命令了。

如果对安装 Java SDK 有疑问的话,可以参考我之前写的一篇文章:『Java』Java 环境搭建

配置完毕了之后,我们可以在命令行中输入 java -version 来查看 Java SDK 的版本:

3.安装 Flutter SDK

Flutter SDK 下载地址:https://docs.flutter.dev/get-started/install/windows/desktop?tab=download

下载完成之后,解压到任意目录下,然后将 Flutter SDK 的 bin 目录添加到环境变量中:

4.安装 Android Studio

Android Studio 下载地址:https://developer.android.com/studio?hl=zh-cn

除了这种方式还可以通过 Toolbox App 来安装 Android Studio:

如果是通过链接的方式下载的,就自行双击安装包运行起来,一顿 Next,如果出现了如下界面,就点击 Cancel 取消:

选择 Custom,点击 Next:

接受许可:

静静的等待安装完毕即可。

oolbox App,2023-12-31 16:17:46 经过测试,Toolbox App 安装的 Android Studio 也是可以的。所以大家可以根据自己的喜好来选择。

5.配置 Android Studio

5.1.安装 Flutter 插件和 Dart 插件

5.2.其它配置

6.用 Android Studio 创建一个 Flutter 项目

配置一下 Flutter SDK:

然后点击 Next:

原生平台开发语言我这里 Android language 与 IOS language 分别选择比较老的 Java 与 O C

点击 create 创建项目即可。

如下是我创建第一个 Flutter 的基本配置参考即可:

6.1.安装设备管理器

点击 start 按钮即可,如果你运行起来发现比较小,你可以参考我下面推荐的配置,单独运行一个窗口来展示设备:

然后将设备管理器停了,在重新运行效果如下:

6.2.运行第一个 Flutter 项目

设备管理器安装好了之后,并且运行过之后,编辑器工具栏的 run 按钮就可以点击了,点击一下运行我们的 Flutter 项目,如下图:

耐心等待运行起来即可,第一次运行需要点时间:

闭坑指南

[!] Network resources X A network error occurred while checking "https://github.com/":信号灯超时时间已到

flutter doctor 过程中出现将以下全部复制粘贴 C:\Windows\System32\drivers\etc\hosts 里面保存:

tex 复制代码
192.30.253.113    github.com
 
192.30.252.131 github.com
 
185.31.16.185 github.global.ssl.fastly.net
 
74.125.237.1 dl-ssl.google.com
 
173.194.127.200 groups.google.com
 
192.30.252.131 github.com
185.31.16.185 github.global.ssl.fastly.net
 
74.125.128.95 ajax.googleapis.com

192.30.255.112  github.com git
185.31.16.184 github.global.ssl.fastly.net 
192.30.253.112    github.com 
192.30.253.119    gist.github.com
151.101.184.133    assets-cdn.github.com
151.101.184.133    raw.githubusercontent.com
151.101.184.133    gist.githubusercontent.com
151.101.184.133    cloud.githubusercontent.com
151.101.184.133    camo.githubusercontent.com
151.101.184.133    avatars0.githubusercontent.com
151.101.184.133    avatars1.githubusercontent.com
151.101.184.133    avatars2.githubusercontent.com
151.101.184.133    avatars3.githubusercontent.com
151.101.184.133    avatars4.githubusercontent.com
151.101.184.133    avatars5.githubusercontent.com
151.101.184.133    avatars6.githubusercontent.com
151.101.184.133    avatars7.githubusercontent.com
151.101.184.133    avatars8.githubusercontent.com

再次运行 flutter doctor -v:

Visual Studio - develop for Windows

Visual Studio not installed; this is necessary for Windows development:未安装Visual Studio;这是Windows开发所必需的。

安装地址:https://visualstudio.microsoft.com/zh-hans/downloads/

End

  • 🐤如果您对本文有任何疑问或想法,请在评论区留言,我将很乐意与您交流。
  • 🐰您的每一条评论对我都至关重要,我会尽快给予回复。
  • 🎈如果您觉得这篇文章对您有所启发或帮助,请不吝赞赏、收藏或分享。
  • 🎁您的每一个动作都是对我创作的最大鼓励和支持。
  • 👍谢谢您的阅读和陪伴!
相关推荐
孤鸿玉2 小时前
Fluter InteractiveViewer 与ScrollView滑动冲突问题解决
flutter
叽哥8 小时前
Flutter Riverpod上手指南
android·flutter·ios
BG1 天前
Flutter 简仿Excel表格组件介绍
flutter
zhangmeng1 天前
FlutterBoost在iOS26真机运行崩溃问题
flutter·app·swift
恋猫de小郭1 天前
对于普通程序员来说 AI 是什么?AI 究竟用的是什么?
前端·flutter·ai编程
卡尔特斯1 天前
Flutter A GlobalKey was used multipletimes inside one widget'schild list.The ...
flutter
w_y_fan1 天前
Flutter 滚动组件总结
前端·flutter
醉过才知酒浓1 天前
Flutter Getx 的页面传参
flutter
火柴就是我2 天前
flutter 之真手势冲突处理
android·flutter
Speed1232 天前
`mockito` 的核心“打桩”规则
flutter·dart