Flutter搭建开发环境和工具安装配置
开始Flutter之前,必须先把开发Flutter所需的环境和工具等配置完成,本章讲下Mac系统下安装配置Flutter环境。
1.Flutter镜像安装,Flutter官方为中国开发者搭建了临时镜像,大家可以不用***就可以快速安装,建议安装到根目录下,方面查找和对应。
//依次执行命令
export PUB_HOSTED_URL=https://pub.flutter-io.cn
export FLUTTER_STORAGE_BASE_URL=https://storage.flutter-io.cn
git clone -b dev https://github.com/flutter/flutter.git
export PATH="$PWD/flutter/bin:$PATH"
cd ./flutter
flutter doctor
- flutter doctor :这个是检查flutter环境是否有问题,如果有问题需要一一解决。
如图:
- 上边两次错误是Android Studio 和 VSCode IDE IDE配置不对未完成(因为我本地有Xcode、Android Studio、VSCode)所以检测出来是没有配置Flutter插件。
如果以上你都很顺利基本上环境是在你的系统上了,但是你可能发现你的环境变量只能在根目录能找到flutter命令。或者每次执行export PATH="$PWD/flutter/bin:$PATH"
,才能使用flutter命令。不着急我们接下来修改下环境变量。
2.更新环境变量
(1). 需要打开/.bash_profile
,如果没有需要创建。
(2).添加路径到文件中。
其中PATH就是你自己安装FlutterSDK的路径,如果不知道路径可以执行 which flutter来查看具体安装的路径。
(3).运行source $HOME/.bash_profile
刷新当前终端窗口
注意:如果你的系统是10.15的系统可能不起作用,因为10.15系统终端是zsh,终端启动时 ~/.bash_profile
将不会被加载,解决办法就是修改 ~/.zshrc
,在其中添加:source ~/.bash_profile
3.升级Flutter SDK和依赖包
升级flutter sdk命令
flutter upgrade
该命令会同时更新Flutter SDK和你的flutter项目依赖包。如果你只想更新项目依赖包(不包括Flutter SDK),可以使用如下命令:
flutter packages get获取项目所有的依赖包。
flutter packages upgrade 获取项目所有依赖包的最新版本。
4.安装Xcode、Android Studio
为iOS开发Flutter程序,需要安装iOS开发工具Xcode,一般安装开发工具后所需要的命令行工具也会一并安装。
为Android开发Flutter程序,需要安装Android开发工具Android Studio。
5.IDE配置和使用
我们可以选择Android Studio和VScode两种工具进行开发flutter。
需要安装俩个插件:
-
Flutter插件,支持Flutter开发工作流 (运行、调试、热重载等)。
-
Dart插件,提供代码分析 (输入代码时进行验证、代码补全等)。
Android Studio
1.打开启动Android Studio
2.打开插件首选项(macOS:Preferences>Plugins或者快捷键Command+,
)
3.选择Plugins,搜索Flutter、Dart插件下载,并重新启动Android Studio后插件生效。
4.创建App,如下。
VS Code
1.打开启动VS Code
2.顶部选择栏选择查看>扩展选项(macOS快捷键:Command+Shift+X
)
3.搜索框搜索flutter、dart并下载,并重新启动VS Code。
4.验证配置和创建App,使用命令Command+Shift+P
,输入框输入flutter会出现
//检测vscode当前flutter环境
Flutter:Run Flutter Doctor
//快捷键创建flutter项目
Flutter:New Project
//更新fluttersdk
Flutter:Run Flutter Upgrage
以上基本上就是全部的环境和工具的配置。
当然中间也会碰到各种各样的问题,特别是对原生iOS和Android不懂得开发,可能会碰到很多坑,如有疑问可以私信留言。
参考:
本文地址:https://blog.csdn.net/u010879240/article/details/107520115
上一篇: 使用XML布局文件控制UI界面
下一篇: 柯尼卡美能达打印机怎么设置双面复印?