Mac搭建Flutter+Dart开发环境

1 下载 Flutter SDK

https://flutter.dev/docs/development/tools/sdk/releases?tab=macos
推荐下载Stable channel, 即稳定版

2 解压SDK

把下载好的 Flutter SDK 随便解压到你想安装SDK的目录, 比如

image.png

查看当前渠道

flutter channel

image.png

可使用以下命令切换渠道

flutter channel master
flutter upgrade

如果遇到报错
git: Aborting Switching channels failed with error code 1.

cd 到flutter安装目录, 执行

git checkout .

然后重新执行

flutter channel master
flutter upgrade

可能中间会失败几次, 多试几次就可以了

image.png

3 安装Dart

Dart官网 https://dart.dev/get-dart

安装Homebrew

/bin/bash -c "$(curl -fsSL https://raw.githubusercontent.com/Homebrew/install/master/install.sh)"

安装dart
 brew tap dart-lang/dart
 brew install dart

如果报错
Error: An exception occurred within a child process: DownloadError: Failed to download resource "dart" Download failed: https://storage.googleapis.com/dart-archive/channels/stable/release/2.7.2/sdk/dartsdk-macos-x64-release.zip

解决方法
根据报错里面的地址, 手动下载, 然后解压放到

/usr/local/Homebrew/dart-sdk

4 配置环境变量

把 Flutter和Dart安装目录的 bin 目录配置到环境变量,然后把 Flutter国内镜像也配置到环境变量里面

vim ~/.bash_profile

添加以下内容

# >>> flutter init >>>
export PATH=~/Development/flutter/bin:$PATH
export FLUTTER_ROOT=~/Development/flutter

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

# >>> dart init >>>
export DART_HOME=~/Development/flutter/bin/cache/dart-sdk/bin
export PATH="${DART_HOME}:${PATH}"
# >>> dart init >>>

注: ~/Development/flutter是步骤2中解压的SDK的存放路径

使内容生效

source ~/.bash_profile

输入

flutter -h

如果能出来一些命令说明 flutter sdk 配置成功。
注意如果配置完成后输入 flutter -h 告诉你 flutter 不是内置命令之类的错误的话,可能 sdk 没有配置成功,也可能 sdk 下载的时候没有下载全

5 分别执行下面命令

sudo xcode-select --switch /Applications/Xcode.app/Contents/Developer

brew update

brew install --HEAD libusbmuxd

brew link libusbmuxd

brew install --HEAD libimobiledevice

brew install ideviceinstaller

brew install ios-deploy

brew install cocoapods

pod setup

可能在运行 brew install --HEAD libimobiledevice 会报错,多试几次就成功了, 如果还是不成功, 可以换成下面的命令

brew install libimobiledevice

6 安装Android SDK

可以自己下载SDK安装, 也可以通过Android Studio安装, 这里推荐用Android Studio来安装, 后续也方便查看项目代码

Android Studio下载地址 https://developer.android.google.cn/studio/

安装完后, 打开, 根据提示安装好相应的SDK即可

7 检测是否配置完成

flutter doctor

如果出现下图, 就是配置成功

image.png

如果出现报错 Android sdkmanager not found. Update to the latest Android SDK and ensure that the cmdline-tools are installed to resolve this.

image.png

打开Android Studio -> Preference -> 搜索框搜索SDK -> Android SDK -> SDK Tools -> 勾选Android SDK Command-line Tools(latest) -> OK

image.png

等待下载完即可, 然后重新执行flutter doctor执行检验

如果安装的Flutter SDK是2.10, 则会报错 HTTP Host Availability HTTP host https://maven.google.com/ is not reachable. Reason: An error occurred while checking the HTTP host: Operation timed out

解决方法

1 找到flutter sdk的文件目录,打开flutter\packages\flutter_tools\lib\src\http_host_validator.dart

2 将https://maven.google.com/修改为https://dl.google.com/dl/andr...

3 关闭终端,重新打开终端

4 去到flutter sdk的文件目录, 找到bin目录,删除cache文件夹

5 在终端重新运行flutter doctor, 问题解决。

image.png

8 命令行工具生成 Flutter 项目

flutter create flutterdemo

9 修改Flutter Sdk目录的权限以及项目的权限

sudo chmod -R 777 /Users/darren/Development/flutter (Flutter SDK 目录)
sudo chmod -R 777 /Users/darren/Desktop/VS Code projects/Flutter/flutterdemo (项目目录)

10 运行iOS项目

注: 打开项目之前一定得先修改权限

Xcode打开项目目录 -> ios -> Runner.xcodeproj -> Command + R 运行

11 VS Code中安装Flutter插件 Dart插件

安装VS Code https://code.visualstudio.com/

设置 -> Extensions -> 搜索并安装 Flutter插件 Flutter Widget Snippets插件 Dart插件

12 用VS Code运行

打开 flutter 项目进行开发, 执行

flutter run

你可能感兴趣的:(Mac搭建Flutter+Dart开发环境)