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项目了


image.png

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


image.png

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


image.png

到这里项目建立起来了,但是还有一个坑等着你呢

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+

image.png
2.图片里的代码在文章尾部有,使用镜像,当然有VPN请随意
image.png
3.找到fluttersdk目录 进入如下目录
Macintosh HD⁩ ▸ ⁨用户⁩ ▸ ⁨rabbit⁩ ▸ ⁨资源库⁩ ▸ ⁨Flutter⁩ ▸ ⁨packages⁩ ▸ ⁨flutter_tools⁩ ▸ ⁨gradle⁩
找到下 flutter.gradle文件 找如如下内容替换成和我一样的 把jcenter注释掉:
image.png

圈住的地方需要更改


image.png

贴出镜像代码:

        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' }

按照上面的三步骤可完美解决问题。

上一篇 下一篇

猜你喜欢

热点阅读