1.下载/安装 Flutter SDK
可以在其官网下载SDK,或者在 GitHub flutter下载 Git 仓库;这里我使用 Sourcetree 从其GitHub下载的仓库,仓库位置可以自定义,这里放在了系统根目录下,该路径下面会用到:
/Users/LiuQiqiang/Flutter
2. 配置环境变量
在系统根目录下,找到 .bash_profile文件 ,使用文本编辑器打开,将以下内容,粘贴到文件中:
export PUB_HOSTED_URL=https://pub.flutter-io.cn
export FLUTTER_STORAGE_BASE_URL=https://storage.flutter-io.cn
export PATH=/Users/LiuQiqiang/Flutter/bin:$PATH
这里的
PATH
为 上面下载的flutter
的路径
如果没有找到该文件,可以使用终端新建,或者直接使用vim 指令来编辑该文件,如果不存在会自动新建:
// 进入根目录
$ cd ~
// 打开/新建 .bash_profile 文件
vim ~/.bash_profile
然后,按键盘 A
或者 i
进入编辑模式,复制上面文本,粘贴进去,接着按 ESC
退出编辑模式进入指令模式,按住 command + :
,输入 wq
,保存并退出。
最后使用下面指令刷新该文件:
source ~/.bash_profile
这时,flutter 指令可以正常在该终端窗口中使用;
全局配置
如果我们关闭了终端,重新打开,或者新开一个终端窗口,会发现 flutter 指令不能使用
command not found: flutter
我们需要将 flutter 的指令在任何窗口中生效,有以下两个方法添加相应指令:
- 方式一
找到根目录下的 .zshrc 文件,使用文本编辑器打开,然后在最后面添加以下指令:
source ~/.bash_profile
- 方式二
使用 终端编辑
// 进入根目录
$ cd ~
// 打开/新建 .zshrc 文件
vim ~/.zshrc
同样,按照上面的指令进入编辑模式,添加以下内容:
source ~/.bash_profile
保存退出即可!
重启终端后,就可以在任意终端窗口中使用 flutter 指令。
第一次使用 flutter 指令时,会自动下载 Dart SDK、工具包等相关的内容,等待下载完成即可!
不出错的话会出现下面的内容:
![](https://img.haomeiwen.com/i1928848/e51a81df607cf303.png)
3. 检查环境配置:flutter doctor
配置完成 flutter SDK 之后,我们可以使用下面的指令来检查相关的配置是否生效:
flutter doctor
第一次执行该指令的时候,会自动下载一些工具包,包括 Dart SDK等;运行结束后,控制台会显示相应的环境配置情况:
![](https://img.haomeiwen.com/i1928848/0b5945d111f8f66e.png)
图中带 ❌ 的都是需要修改的,带✅的都是配置完成的;
这里为配置完成了VS Code;
根据出错的提示,去完善相应的配置。
4. 详细配置
Android licenses
[!] Android toolchain - develop for Android devices (Android SDK version 29.0.2)
✗ Android licenses not accepted. To resolve this, run: flutter doctor
--android-licenses
根据提示,终端输入指令 flutter doctor --android-licenses
即可;主要是Android 相关的一些协议,输入 y 会车接受即可,会有很多个,挨个接受即可;
Xcode - develop for iOS and macOS
[!] Xcode - develop for iOS and macOS
✗ Xcode installation is incomplete; a full installation is necessary for iOS
development.
Download at: https://developer.apple.com/xcode/download/
Or install Xcode via the App Store.
Once installed, run:
sudo xcode-select --switch /Applications/Xcode.app/Contents/Developer
Android Studio
[!] Android Studio (version 3.4)
✗ Flutter plugin not installed; this adds Flutter specific functionality.
✗ Dart plugin not installed; this adds Dart specific functionality.
这里 Android Studio 没有安装相关的插件,打开Android Studio:
在欢迎页 Configure -> Plugins 打开插件管理面板
![](https://img.haomeiwen.com/i1928848/e362fd7bad5b60c7.png)
选择 Marketplace 选项卡,在搜索框内输入 flutter:
![](https://img.haomeiwen.com/i1928848/eafee5c992da28d7.png)
下载安装第一个 Flutter。会同时安装 Dart 插件,完成后重启 IDE 即可!
会发现多了个 flutter 工程的创建按钮:
![](https://img.haomeiwen.com/i1928848/fa28fd8c30ee5bef.png)
IntelliJ IDEA
电脑安装了 IntelliJ IDEA ,所以在使用 flutter doctor 的时候会有相应的错误提示,很简单,只是缺少了 Flutter 和 Dart 插件:
[!] IntelliJ IDEA Community Edition (version 2019.2)
✗ Flutter plugin not installed; this adds Flutter specific functionality.
✗ Dart plugin not installed; this adds Dart specific functionality.
打开 IntelliJ IDEA,在欢迎页,右下角,选择 Configure,在弹出列表中选择 Plugins:
![](https://img.haomeiwen.com/i1928848/626a6d23ab3da996.png)
在搜索框输入 flutter,这时会查找不到任何插件:
![](https://img.haomeiwen.com/i1928848/4c1e08b253936ee5.png)
点击 Search in repositories ,在弹出的新窗口中,搜索结果列表选择 Flutter,然后 Install 即可:
![](https://img.haomeiwen.com/i1928848/4407df34e7195c1c.png)
此时会连同 Dart 的插件一同下载,完成后,重启 IDE,新建工程,选择 Flutter 工程
所有的完成后,终端重新输入 flutter doctor
指令检查一下即可:
![](https://img.haomeiwen.com/i1928848/8543695e41afbc46.png)
其他
升级flutter版本
flutter upgrade
网友评论