一、在Windows上搭建Flutter开发环境

系统要求
要安装和运行Flutter,您的开发环境必须满足以下最低要求:

 操作系统Windows 7 SP1或更高版本(64位)磁盘空间::400 MB(不包括IDE/Tools的磁盘空间)。工具颤振取决于您的环境中可用的这些工具。Windows PowerShell 5.0或者更新(这是与Windows 10一起预装的)Git for Windows2.x,与从Windows命令提示符中使用Git选择。如果GitforWindows已经安装,请确保可以运行git命令提示符或PowerShell中的命令。

获取Flutter SDK
1.去flutter官网下载其最新可用的安装包,下载地址:
https://flutter.dev/docs/development/tools/sdk/releases,如图:可选择平台及版本

注意:Flutter的渠道版本会不停变动,请以Flutter官网为准。另外,在中国大陆地区,要想正常获取安装包列表或下载安装包,可能需要翻墙,读者也可以去Flutter github项目下去下载安装包,地址:https://github.com/flutter/flutter/releases 。

将安装包zip解压到你想安装Flutter SDK的路径(如:C:\src\flutter;注意,不要将flutter安装到需要一些高权限的路径如C:\Program Files\)。

在Flutter安装目录的flutter文件下找到flutter_console.bat,双击运行并启动flutter命令行,接下来,你就可以在Flutter命令行运行flutter命令了。如图:

更新环境变量
如果你想在Windows系统自带命令行运行flutter命令,需要添加以下环境变量到用户PATH:

将 …\flutter\bin 的全路径加入path

测试是否生效:
win+r:cmd
输入flutter -h查看是否生效

Android设置
Flutter依赖于Android Studio的全量安装。Android Studio不仅可以管理Android 平台依赖、SDK版本等,而且它也是Flutter开发推荐的IDE之一(当然,你也可以使用其它编辑器或IDE,vscode,IntelliJ IDEA等)。

安装Android Studio
下载并安装 Android Studio,下载地址:https://developer.android.com/studio/index.html 。
打不开请自行翻墙。下载完毕傻瓜式安装及可。

二、在macOS上搭建Flutter开发环境

在masOS下可以同时进行Android和iOS设备的测试。

系统要求
要安装并运行Flutter,您的开发环境必须满足以下最低要求:

操作系统: macOS (64-bit)
磁盘空间: 700 MB (不包括Xcode或Android Studio的磁盘空间).
工具: Flutter 依赖下面这些命令行工具.
bash、mkdir、rm、git、curl、unzip、which

获取Flutter SDK
1.去flutter官网下载其最新可用的安装包,官网地址:https://flutter.io/sdk-archive/#macos

注意,Flutter的渠道版本会不停变动,请以Flutter官网为准。另外,在中国大陆地区,要想正常获取安装包列表或下载安装包,可能需要翻墙,读者也可以去Flutter github项目下去下载安装包,地址:https://github.com/flutter/flutter/releases 。

2.解压安装包到你想安装的目录,如:

cd ~/development
unzip ~/Downloads/flutter_macos_v1.21.13-beta.zip

3.添加flutter相关工具到path中:

export PATH=`pwd`/flutter/bin:$PATH

此代码只能暂时针对当前命令行窗口设置PATH环境变量,要想永久将Flutter添加到PATH中请参考下面更新环境变量部分。

更新环境变量
将Flutter添加到PATH中,可以在任何终端会话中运行flutter命令。

对于所有终端会话永久修改此变量的步骤是和特定计算机系统相关的。通常,您会在打开新窗口时将设置环境变量的命令添加到执行的文件中。例如

1.确定您Flutter SDK的目录记为“FLUTTER_INSTALL_PATH”,您将在步骤3中用到。
2.打开(或创建) $HOME/.bash_profile。文件路径和文件名可能在你的电脑上不同.
3.添加以下路径:

export PATH=[FLUTTER_INSTALL_PATH]/flutter/bin:$PATH

例如Flutter 安装目录是“~/code/flutter_dir”,那么代码为:

export PATH=~/code/flutter_dir/flutter/bin:$PATH

4.运行 source $HOME/.bash_profile 刷新当前终端窗口。

注意: 如果你使用终端是zsh,终端启动时 ~/.bash_profile 将不会被加载,解决办法就是修改 ~/.zshrc
,在其中添加:source ~/.bash_profile

5.验证“flutter/bin”是否已在PATH中:

echo $PATH

安装 Xcode
要为iOS开发Flutter应用程序,您需要Xcode 9.0或更高版本:

1.安装Xcode 9.0或更新版本(通过链接下载或苹果应用商店)。

2.配置Xcode命令行工具以使用新安装的Xcode版本 sudo xcode-select --switch /Applications/Xcode.app/Contents/Developer 对于大多数情况,当您想要使用最新版本的Xcode时,这是正确的路径。如果您需要使用不同的版本,请指定相应路径。

3.确保Xcode许可协议是通过打开一次Xcode或通过命令sudo xcodebuild -license同意过了.
使用Xcode,您可以在iOS设备或模拟器上运行Flutter应用程序。

安装Android Studio
和Window一样,要在Android设备上构建并运行Flutter程序都需要先安装Android Studio,在此不再赘述。

升级 Flutter

Flutter SDK分支
Flutter SDK有多个分支,如beta、dev、master、stable,其中stable分支为稳定分支,dev和master为开发分支,安装flutter后,你可以运行flutter channel查看所有分支,本地运行后,结果如下:

Flutter channels:betadev
* master

带"*"号的分支即你本地的Flutter SDK 跟踪的分支,要切换分支,可以使用flutter channel beta 或 flutter channel master,Flutter官方建议跟踪稳定分支,但你也可以跟踪master分支,这样可以查看最新的变化,但这样稳定性要低的多。

升级Flutter SDK和依赖包
要升级flutter sdk,只需一句命令:

flutter upgrade

该命令会同时更新Flutter SDK和你的flutter项目依赖包。如果你只想更新项目依赖包(不包括Flutter SDK),可以使用如下命令:
fl

utter packages get获取项目所有的依赖包。
flutter packages upgrade 获取项目所有依赖包的最新版本。

三、IDE配置与使用

理论上可以使用任何文本编辑器与命令行工具来构建Flutter应用程序。 不过,Flutter官方建议使用Android Studio和VS Code之一以获得更好的开发体验。Flutter官方提供了这两款编辑器插件,通过IDE和插件可获得代码补全、语法高亮、widget编辑辅助、运行和调试支持等功能,可以帮助我们极大的提高开发效率。

Android Studio 配置与使用
由于Android Studio是基于IntelliJ IDEA开发的,所以读者也可以使用IntelliJ IDEA。

安装Flutter和Dart插件
安装步骤:

启动Android Studio。
打开插件首选项 (macOS:Preferences>Plugins, Windows:File>Settings>Plugins)。
选择 Browse repositories…,选择 flutter 插件并点击 install。
重启Android Studio后插件生效。

若第一次运行Android Studio,步骤如下:





选择自己喜欢的风格


启动Android Studio后,打开插件首选项 (macOS:Preferences>Plugins, Windows:File>Settings>Plugins)。
直接搜索flutter,选择 flutter 插件并点击 install。重启Android Studio后插件生效。如图:

flutter插件安装好之后,Dart插件随之自动安装,我们可以搜索dart插件测试,看是否装好。

运行 flutter doctor 命令
在Flutter命令行运行如下命令来查看是否还需要安装其它依赖,如果需要,安装它们:
flutter doctor -v(显示详细信息)

flutter doctor

该命令检查你的环境并在命令行窗口中显示报告。Dart SDK已经在打包在Flutter SDK里了,没有必要单独安装Dart。 仔细检查命令行输出以获取可能需要安装的其他软件或进一步需要执行的任务。
例如:

检测到前面打对勾的都是没问题的(我这因为电脑问题会乱码),如果出现感叹号,就是依赖没装好,按照提示运行指令即可。

创建Flutter应用
1.选择 File>New Flutter Project
2.选择 Flutter application 作为 project 类型, 然后点击 Next
3.如图:

4.点击 Finish。
5.等待Android Studio安装SDK并创建项目。
6.创建好如图:

此时没有可用设备,我们创建一个虚拟设备,步骤如下:
1.Tools–>AVD Manager
2.如图:双击红框框中选项

3.根据实际情况选择,点击Next

4.选择系统并下载,下载完成后点击Next
5.确定好后点击Finish

6.点击运行

7.运行完成如图:

8.点击绿框中按钮,以Debug方式运行

9.完成后如图,我们可以修改代码测试,至此Android Studio 搭建Flutter开发环境完成

VS Code的配置与使用
VS Code是一个轻量级编辑器,支持Flutter运行和调试

安装 Flutter 和 Dart 插件
打开 VS Code。
点击左侧栏Extensions
在扩展搜索输入框中输入 “flutter”,然后在列表中选择 Flutter 并单击 安装。此过程中会自动安装必需的 Dart 插件。
点击 重新加载 以重新启动 VS Code。

创建Flutter应用
启动 VS Code
调用 View>Command Palette…
输入 ‘flutter’, 然后选择 ‘Flutter: New Project’ action
输入 Project 名称 (如myapp), 然后按回车键
指定放置项目的位置,然后选择目录并确定
等待项目创建继续,并显示main.dart文件

运行程序
1.找到 VS Code 的状态栏(窗口底部蓝色的条),点击 No Devices 然后打开一个模拟器。

2.创建

3.创建完成

4.点击Run and Debug或者按F5,当应用启动以后— 处理进度会出现在 Debug Console 页面中。
当应用编译完成后,就可以在设备上运行这个起步应用了。

超级详细flutter开发环境搭建相关推荐

  1. iOS开发 超详细Flutter开发环境搭建

    1 .安装Flutter 此文章针对针对移动开发者,关于Flutter环境搭建,仅供参考,也可参考官网<https://flutter.dve/> 1.1.下载Flutter SDK 进入 ...

  2. 【Flutter开发环境搭建】二、Android SDK、Dart SDK及Flutter SDK安装

    一.Android Studio下载安装 Android Studio下载:Download Android Studio and SDK tools  |  Android Developers 下 ...

  3. 【Flutter】Flutter 开发环境搭建 ( 2021年08月25日 补充最新资料 | 最新安装教程 )

    文章目录 前言 一.Android Studio 环境安装 Flutter / Dart 插件 二.Flutter SDK 下载 三.设置 Flutter 环境变量 1.设置 Flutter SDK环 ...

  4. 【Flutter】Flutter 开发环境搭建 ( Android Studio 下 Flutter / Dart 插件安装 | Flutter SDK 安装 | 环境变量配置 | 开发环境检查 )

    文章目录 一.Flutter 学习资料 二.Flutter 开发环境搭建 三.Android Studio 环境安装 Flutter / Dart 插件 四.下载 Flutter SDK 五.设置 F ...

  5. Android Flutter开发环境搭建

    1.搭建 Flutter 开发环境 本栏亦在快速上手Android Flutter,Flutter框架就不介绍了,框架这个东西怎么说呢,对于大部分人来说只是了解即可,如需了解的话,可以度娘资料很多. ...

  6. Flutter开发环境搭建Mac版

    由于我公司使用的是Mac电脑,但家里是windows.所以这篇文章没有视频,但我会写的尽量详细.希望你能通过阅读文章,也能在mac上搭建起Flutter环境.照着这篇文章配置时,你最好自备了梯子,否则 ...

  7. flutter开发环境搭建

    一.环境搭建 1.下载最新版本sdk  https://flutter.cn/docs/development/tools/sdk/releases?tab=macos 2.在环境配置文件(.bash ...

  8. mac Android Studio 环境搭建,flutter开发环境搭建,已经加快AS的编译速度(Android mac 系统配置)

    mac电脑重装了,记录一下整个安装流程,省的以后浪费时间吧.亲测都是有效的,最后编译的速度,从最开始的30分钟,首次下载的东西比较多,到11分钟,最后到2分钟.大家可以试试. Android stud ...

  9. Ubuntu18.04 Flutter开发环境搭建

    目录 flutter安装 android studio安装 Android Studio创建Flutter项目 运行应用程序 flutter安装 下载flutter https://flutter.d ...

最新文章

  1. three.js 调用网络摄像头
  2. I、Q 通道幅相不平衡的影响及改善
  3. 全球及中国家电用PET薄膜涂层钢卷市场前景形势与未来竞争规模展望报告2022版
  4. 二叉树中的最大路径和
  5. 松鼠聚会(洛谷-P3964)
  6. 电脑安装python3.74_在Python3.74+PyCharm2020.1 x64中安装使用Kivy的详细教程
  7. UWP Composition API - GroupListView(二)
  8. webConfig详细跳转配置.[转]
  9. XSS注入,js脚本注入后台
  10. Python编程入门-第二章学习笔记
  11. js获取元素,窗口的宽度、高度
  12. EasyDarwin —— windows搭建rtsp服务,使用FFmpeg进行rtsp推拉流
  13. IOS OpenGL ES GPUImage 图像 XYDerivative 边缘检测 GPUImageXYDerivativeFilter
  14. 软件工程__CMMCMMI
  15. Android Studio连接MySQL:问题解决:虚拟机无法连接本地SQL,coon总为空
  16. 我的信息化教学改革实践-“oao‘课堂
  17. Wave VR Native SDK学习(一)
  18. 面试部分梳理 - 计算机网络
  19. 楚留香服务器维护,楚留香手游3月9日维护更新公告
  20. 马化腾“扛不住了”?微信“跟风”推出新功能,像极了当年的QQ

热门文章

  1. 光复印机常见故障代码及解决办法
  2. 学计算机会会恢复手机文件吗,恢复被删除的文件的方法是什么 四大办法轻松应对【图文教程】...
  3. 安卓面试中高级安卓开发工程师总结之——大公司的任职资格要求总结(2018年)
  4. 为什么测量工具是灰的无法使用?
  5. CGAL笔记之单元格复合体和多面体篇—三维多面体曲面
  6. Android调用摄像头和相册
  7. 【Unity优化篇】 | Unity脚本代码优化策略,快速获取 游戏对象 和 组件 的方法【文末送书】
  8. ATE 测试及IC测试原理之 IDD测试
  9. 几种室内无线定位算法
  10. 杰理之涂鸦智能手机 APP【篇】