1 . 本地环境的要求

1. window10 64位 / window7 64位
2. 所需空間最好5G , 最低配置3G

2 . 安装步骤

第一步 : 安裝Java SDK

百度搜索 Java SDK , 并进入下面红色框框的java官网

Image.png

进来java官网后 , 我们往下拉到以下位置 , 并且点击同意[Accept License Agreement] , 这个选项 , 否则无法下载 , 然后选择我们所需要安装的32位/64位的java SDK , 点击下面的下载链接后 , 可能会叫我们登录Oracle账号 , 我们可以选择不登录 , SDK也会自动下载的

Image.png

然后安装过程 , 网上的教程很多了 , 这里不做赘述 , 下面是我按照网上搭建的java SDK教程

• window7 64位环境下搭建Java SDK 教程 , 引用以下文章https://blog.csdn.net/technologyleader/article/details/82850893
• window10 64位环境Java SDK 教程 , 引用以下文章
  https://www.cnblogs.com/nebie/p/Howie.html

安装完Java SDK后 , 就开始安装Flutter SDK 了

第二步 : 安装Flutter SDK

安装flutter , 需要一个翻墙的环境 , 不然下载会很慢 , 也可能会在flutter配置过程中出错

在flutter官网下载 flutter
https://flutter.dev/docs/development/tools/sdk/releases#windows
在这个网址下面我们可以看到有四个版本

第一个 : Stable channel (Windows) 稳定版本, 推荐使用, 稳定版本
第二个 : Beta channel (Windows) 最新版, 最新版会有很多测试功能, 但是有些功能支持度不高
第三个 : Dev channel (Windows) 开发板, 开发板会有很多自定义的设置, 但是这个会有很多都是缺失的, 非熟练使用flutter的人员, 切勿使用这个版本
第四个 : Master channel 主版本, 安装捆绑包不可用于master。但是，您可以通过克隆主版本，然后触发SDK依赖项的下载，直接从Github repo获取SDK：

• Stable channel (Windows) 稳定版本 , 推荐使用, 稳定版本
  Image.png

• Beta channel (Windows) 最新版 , 最新版会有很多测试功能, 但是有些功能支持度不高
  Image.png

• Dev channel (Windows) 开发板, 开发板会有很多自定义的设置, 但是这个会有很多都是缺失的, 非熟练使用flutter的人员, 切勿使用这个版本
  Image.png

• Master channel 主版本, 安装捆绑包不可用于master。但是，您可以通过克隆主版本，然后触发SDK依赖项的下载，直接从Github repo获取SDK：

  
  
  Image.png

在下载完flutter SDK后 , 我们只需要将Flutter SDK 直接解压到Flutter文件夹即可 , 注意路径不能有中文

Image.png

Image.png

Image.png

1df88be70eba23676ccb3485edd769d.png

Image.png

可能会出现的问题

• 出现以上即可完成flutter配置 , 输入flutter命令后 , 命令行没有反应 , 可试试第一 : 重启电脑 , 第二 : 添加用户配置环境变量

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

Image.png

Image.png

FLUTTER_STORAGE_BASE_URL和PUB_HOSTED_URL都是针对国内不能访问国外网络而设置的镜像

Image.png

第三步 : 安装Android Studio , 具体的安装步骤可在网上进行查找安装

• 以下是我参考的安装教程
  Android studio的安装(https://www.cnblogs.com/xqz0618/p/install.html)

• 安装完Android Studio后 , 如果使用Android Studio工具进行flutter的话 , 就需要安装Android Studio 的flutter插件了 , 开始打开Android Studio , 在配置中添加插件
  Image.png
  Image.png
  
  
  然后安装这个插件
  Image.png

• 安装好flutter插件后 , 重启编译器即可完成AndroidStudio的flutter插件安装 , 然后我们 , 在 Android Studio新建我们的Flutter文件
  Image.png
  
  
  接下来会有四个选项给我们
  Image.png

这里有四个选项 ,
第一个是FlutterApp ,
第二个是Flutter插件 ,
第三个是FLutter包 ,
第四个是FLutter模块 ,
我们选择第一个 , 点击next

Image.png

这四个选项分别是
project name文件名;
Flutter SDK path FlutterSDK路径 , 通常会自动匹配上 , 如果个人有修改 , 可自定义
Project location 文件保存路径
Description 文件描述
设置好以上四个选项后 , 再次点击next

Image.png

Image.png

Image.png

Image.png

Image.png

Image.png

Image.png

一旦出现以上这两个页面即可配置成功 ,就可以在Android Studio开始开发flutter项目了

倘若我们是在vs code进行开发Flutter 项目 , 就需要在vs code进行配置Flutter插件 , 同时建议使用vs code进行开发 , 所以使用Android Studio去新建项目 , 对于前端开发人员是不建议的 , 下面开始介绍vs code工具进行flutter开发

打开vs code 安装flutter插件和dart插件 , 但是一般我们安装flutter插件的时候 , vs code就会自动安装dart插件的 , 安装完flutter插件后 , 就重启vs code , 再vs code命令行输入

flutter create demo001

Image.png

Image.png

flutter run

出现这些信息即可开启成功

Image.png

具体问题在评论 , 尽情提问 , 小编很乐意跟大家讨论Flutter方面的问题