Mac上安装配置Flutter
2018-12-25 本文已影响0人
几行代码
这是中文网:https://flutterchina.club/
由于本人长时间使用windows系统,最近才开始使用mac系统,有些不熟悉,因此在这里简单做个笔记。 要在目录下创建好/flutter这个文件夹
首先打开mac的终端
1.切换到自己想要安装的目录下 cd xxxxx 例如:cd ~/fly
2.配置镜像:export PUB_HOSTED_URL=https://pub.flutter-io.cn
export FLUTTER_STORAGE_BASE_URL=https://storage.flutter-io.cn
3.从github上clone项目:git clone -b dev https://github.com/flutter/flutter.git
4.配置环境变量:
export PATH=/Users/用户名/Documents/flutter/flutter/bin:$PATH
export ANDROID_HOME="/Users/用户名/Documents/android_sdk" //android sdk目录,替换为你自己的即可
export PATH=${PATH}:${ANDROID_HOME}/tools
export PATH=${PATH}:${ANDROID_HOME}/platform-tools
用上面的作为参考,配置环境变量
5.在切换到下载好的flutter文件下,执行:cd ./flutter
6.执行:flutter doctor
第一次的时候可能会比较慢,因为要下载很多东西。
接下来如何在Android Studio中配置插件并创建第一个flutter项目了

创建项目的时候会遇到上面的小问题
解决办法:
切换到flutter下面执行命令:echo $PATH
就会看到路径
复制到这里就好了

有时候会遇到没有
new flutter project这个选项
这时候打开设置插件:把圈住的地方全部勾选

到这里项目建立起来了,但是还有一个坑等着你呢
Launching lib/main.dart on OS103 in debug mode...
Initializing gradle...
Finished with error: ProcessException: Process "/Users/xxx/Downloads/flutter_app/android/gradlew" exited abnormally:
Unzipping /Users/xxx/.gradle/wrapper/dists/gradle-4.10.2-all/9fahxiiecdb76a5g3aw9oi8rv/gradle-4.10.2-all.zip to /Users/xxx/.gradle/wrapper/dists/gradle-4.10.2-all/9fahxiiecdb76a5g3aw9oi8rv
Exception in thread "main" java.util.zip.ZipException: error in opening zip file
at java.util.zip.ZipFile.open(Native Method)
at java.util.zip.ZipFile.<init>(ZipFile.java:219)
at java.util.zip.ZipFile.<init>(ZipFile.java:149)
at java.util.zip.ZipFile.<init>(ZipFile.java:163)
at org.gradle.wrapper.Install.unzip(Install.java:214)
at org.gradle.wrapper.Install.access$600(Install.java:27)
at org.gradle.wrapper.Install$1.call(Install.java:74)
at org.gradle.wrapper.Install$1.call(Install.java:48)
at org.gradle.wrapper.ExclusiveFileAccessManager.access(ExclusiveFileAccessManager.java:65)
at org.gradle.wrapper.Install.createDist(Install.java:48)
at org.gradle.wrapper.WrapperExecutor.execute(WrapperExecutor.java:128)
at org.gradle.wrapper.GradleWrapperMain.main(GradleWrapperMain.java:61)
Command: /Users/xxx/Downloads/flutter_app/android/gradlew -v
出现上面的问题的解决办法:
1.我这里是studio3.2版本对应的是gradle-4.6+

2.图片里的代码在文章尾部有,使用镜像,当然有VPN请随意

3.找到fluttersdk目录 进入如下目录
Macintosh HD ▸ 用户 ▸ rabbit ▸ 资源库 ▸ Flutter ▸ packages ▸ flutter_tools ▸ gradle
找到下 flutter.gradle文件 找如如下内容替换成和我一样的 把jcenter注释掉:

圈住的地方需要更改

贴出镜像代码:
maven { url 'https://maven.aliyun.com/repository/google' }
maven { url 'https://maven.aliyun.com/repository/jcenter' }
maven { url 'http://maven.aliyun.com/nexus/content/groups/public' }
按照上面的三步骤可完美解决问题。