Flutter 环境搭建,项目运行,多图超详细教程

697 阅读2分钟

第一步 JDK环境配置

jdk环境配置就不过多介绍,可自己搜索配置

jdk下载链接www.oracle.com/cn/java/tec…

jdk版本选择注意点
多数开发者可能都是配置了jdk 1.8的,但较新的flutter版本只支持jdk 11以上,所以单纯flutter开发建议使用11以上的jdk,或者准备多个版本的jdk进行切换。

第二步 安卓环境配置

建议直接下载Android Studio

下载链接developer.android.com/studio/inst…

下载安装之后进行环境配置,此步骤自行搜索配置

配置完成上面进入后,先安装flutter的插件

image.png

然后就可以在AS 创建flutter项目

image.png

需要模拟器的也可以在AS上面创建

image.png

当然现在还不能创建项目运行,因为flutter的环境还没配置

第三步 Flutter SDK配置

下载链接 flutter.cn/docs/develo…

自行选择需要的版本

下载完成解压到对应目录

image.png

image.png

接下来就是flutter的环境变量配置

此电脑 ===> 属性 ===> 高级系统配置 ===> 环境变量 ===> 系统变量 ===> Path ===>

image.png

sdk解压目录的bin文件路径

image.png

验证sdk是否安装成功

win + r 输入cmd 打开控制面板,输入 flutter doctor

image.png

可以查看flutter版本则是配置成功,有些报错是桌面端的,不开发桌面端可以忽略

第四步 用AS创建一个新的flutter项目

new flutter project ===> 选择flutter sdk目录 ===> 项目路径包名平台选择

image.png

image.png

等待一下即可创建完成

接下来创建一个设备运行项目

image.png

控制台命令启动flutter run,或者一键启动都行

image.png

image.png

至此则是跑起来我们的第一个flutter项目

注意点

如果项目运行报错,说jdk版本过低,则需要下载高版本jdk进行更换

file ===> Project Structure ===>Project Settings ===> SDKs

image.png

手动切换项目依赖的jdk版本重新运行即可

第六步 VS Code运行项目

同样先下载flutter 插件

image.png

然后 View ===> Command Palette. ===> Flutter Project ===> Application ===>选择目录 ===>创建即可

image.png

控制台运行flutter run,需要debug模式则点击左边debug的按钮。

image.png

至此vscode也运行起flutter项目

小结

以上则是flutter在windows上的环境配置和项目运行,只是基础的移动端环境配置,如要客户端则还要配置Visual Studio的环境,本文咱没详细说明。

如有错误之处,欢迎指正,共同进步。