Flutter - 环境搭建

重心出发、从头开始

我这里使用的是imac进行安装的

一、安装flutter sdk

//1.终端中输入以下指令克隆项目
git clone -b beta https://github.com/flutter/flutter.git
//2. 导出到Flutter保存路径
export PATH=`pwd`/flutter/bin:$PATH

由于国内网络限制我们可以通过修改镜像地址来解决, 好在Google良心,专门给我们大陆提供了方案, 终端中一次输入以下命令即可解决。

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

2.1 ***

这里我遇到第一个问题，就是提示

zsh: command not found: flutter

这说明我配置flutter命令没有成功，检测一下路径是否有问题，可以cd到/Users/用户名/Flutter 目录下，使用flutter -h，查看运行结果，如果失败，就检测一下路径。

如果上面路径下提示成功，在其他路径下提示不成功，那么进行下面命令

vim ~/.zshrc

export PATH=（flutter/bin的路径）:$PATH

source ~/.zshrc

到这里，按道理应该可是在任何路径下使用flutter命令了

2.1 ***

谁知到第二个问题又来了

Failed to retrieve the Dart SDK from: https://storage.googleapis.com/flutter_infra/flutter/540786dd51f112885a89792d678296b95e6622e5/dart-sdk-darwin-x64.zip
If you're located in China, please see this page:
https://flutter.dev/community/china

image.png

这里好像说的是国内网络又不行了、、、 我、、、

解决办法：
执行flutter doctor之前，先执行一下命令

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

到这里，正常执行flutter doctor啦

三、配置环境

这里我预先下载好了 Android Studio 和 Xcode

执行完 flutter doctor 发现一堆的红叉，就知道又要配置相关的东西，下面就一个一个来解决吧：

image.png

3.1 ***

Android toolchain - develop for Android devices
✗ Unable to locate Android SDK.
Install Android Studio from:
https://developer.android.com/studio/index.html
On first launch it will assist you in installing the Android SDK
components.
(or visit https://flutter.dev/docs/get-started/install/macos#android-setup
for detailed instructions).
If the Android SDK has been installed to a custom location, set
ANDROID_SDK_ROOT to that location.
You may also want to add it to your PATH environment variable.

解决办法
执行下面这句，然后一路按y

flutter doctor --android-licenses

image.png

3.2 ***

Xcode - develop for iOS and macOS (Xcode 11.4.1)
✗ CocoaPods not installed.
CocoaPods is used to retrieve the iOS and macOS platform side's plugin
code that responds to your plugin usage on the Dart side.
Without CocoaPods, plugins will not work on iOS or macOS.
For more info, see https://flutter.dev/platform-plugins
To install:
sudo gem install cocoapods

解决办法
这里很明显就是没有安装 cocoapods，先安装一个，安装好了就不报错了:

iOS安装CocoaPods详细过程 https://www.jianshu.com/p/b0dc4e8d872f

image.png

3.3 ***

Android Studio (version 3.6)
✗ Flutter plugin not installed; this adds Flutter specific functionality.
✗ Dart plugin not installed; this adds Dart specific functionality.
[!] Connected device

这个是提示我们 Android Studio 没有安装 Flutter 插件和 Dart 插件

让我们打开 Android Studio , 点击 Plugins，选择 Browse repositories，搜索 Flutter 进行安装，在安装 flutter 时，编辑器也会帮我们安装 dart 插件，安装完成

image.png

image.png

后面两个感叹号先不管

三、创建项目

这里我先用Android Studio创建一个Demo

image.png

官方文档配置

https://flutter.cn/docs/get-started/install/macos#create-and-run-a-simple-flutter-app
https://www.jianshu.com/p/be8108497c54