Mac下安装Flutter,并创建第一个App
source link: http://www.10tiao.com/html/275/201807/2653646436/1.html
Go to the source link to view the article. You can view the picture content, updated content and better typesetting reading experience. If the link is broken, please click the button below to view the snapshot at that time.
相关软件安装
JDK安装
下载
前往下载页面下载安装包:
http://www.oracle.com/technetwork/java/javase/downloads/index.html
下载8.x的版本,8以上的会出问题
安装
双击安装包,一路下一步至完成
配置
找到jdk安装路径,一版情况为:
/Library/Java/JavaVirtualMachines/jdk-8.jdk/Contents/Home
也可以打开访达,选择菜单【前往】-【电脑】,随后进入路径【Macintosh HD】-【资源库】中看是否存在Java文件夹,然后找寻安装路径;
检查用户文件夹下是否存在.bash_profile文件,不存在则创建;
将如下代码添加到.bash_profile文件中
JAVA_HOME=/Library/Java/JavaVirtualMachines/jdk-10.0.1.jdk/Contents/Home
PATH=$JAVA_HOME/bin:$PATH:.
CLASSPATH=$JAVA_HOME/lib/tools.jar:$JAVA_HOME/lib/dt.jar:.
export JAVA_HOME
export PATH
export CLASSPATH
在终端输入如下命令是配置生效
source ~/.bash_profile
输入如下命令检测是否配置成功,如果成功将输出配置的路径
echo $JAVA_HOME
Android Studio安装
下载
前往下载页面下载安装包:
https://developer.android.com/studio/
或者直接点击下载:Android Studio v3.1.3(https://dl.google.com/dl/android/studio/install/3.1.3.0/android-studio-ide-173.4819257-mac.dmg)
请在官网下载,避免出现
XcodeGhost(https://www.zhihu.com/question/35721299)类似问题
安装
双击安装包,将应用拖拽到【应用程序】中,完成安装。
配置
安装完成后打开Android Studio应用;
第一次打开会询问是否导入设置,按照需求选择,我是第一使用,我选择第二项;
第一次使用会弹出无法访问Android SDK,暂时点Cancel;
随后界面一路蓝色按钮点击即可。
最后一步是下载相关资源,下载结束后即可进入Android Studio了。
在.bash_profile中放入下列代码
export ANDROID_HOME=/Users/mingyu/Library/Android/sdk
export PATH=${PATH}:${ANDROID_HOME}/tools
export PATH=${PATH}:${ANDROID_HOME}/platform-tools
还要安装插件,打开Android Studio,在【首页】-【Configure】-【Plugins】中所有插件Flutter和Dart进行安装;
Xcode安装
直接在App Store中搜索Xcode进行安装
VSCode安装
开发IDE,直接去官网下载(https://code.visualstudio.com/),下载安装后,需要安装两个扩展:Dart和Flutter,直接在扩展中搜索安装即可。
Brew安装
包管理工具,flutter必须的一些包需要用它来安装;
前往官方网站(https://brew.sh/index_zh-cn),按照上面最新的提示进行安装;
安装好后,可以选择使用国内镜像,打开终端,执行下列命令:
# 参考文档:https://mirror.tuna.tsinghua.edu.cn/help/homebrew/
cd /usr/local/Homebrew
git remote set-url origin https://mirrors.tuna.tsinghua.edu.cn/git/homebrew/brew.git
cd /usr/local/Homebrew/Library/Taps/homebrew/homebrew-core
git remote set-url origin https://mirrors.tuna.tsinghua.edu.cn/git/homebrew/homebrew-core.git
brew update
# update 时间较长,耐心等待
Flutter安装
下载
执行下列命令下载最新的flutter代码(系统请先安装Git)
git clone -b beta https://github.com/flutter/flutter.git
安装&配置
在用户文件夹下找到.bash_profile文件,如果没有就创建一个;
在文件中加入如下代码:
export PUB_HOSTED_URL=https://pub.flutter-io.cn # 国内用户需要设置
export FLUTTER_STORAGE_BASE_URL=https://storage.flutter-io.cn # 国内用户需要设置
export PATH={Fluter代码存放目录}/bin:$PATH
添加保存后,执行下列命令刷新终端:
source $HOME/.bash_profile
运行下列命令检查flutter是否已经安装成功:
flutter -v
第一次运行会安装一些东西,然后显示欢迎提示,告知已经安装成功;
接下来需要运行下列命令检查flutter的依赖项:
flutter doctor
运行该命令后,flutter会提示你那些东西是必须要的,需要执行什么命令进行安装,按照提示安装即可;
其中必要的一项,请创一个虚拟Android虚拟设备,并保持开机状态。
第一个Flutter App
打开VSCode,按F1(有touchbar的机子按住fn可见F1)呼出命令输入框;
输入字符Flutter,在命令候选列表中选择Flutter: New Project,新建一个Flutter项目,随后让你填写项目名称和选择项目存放路径;
项目创建好后,在VSCode右下角选择调试环境目标:
按F5运行项目;
这里我遇到了报错有关于gradle的,解决方案是删除用户文件夹下的.gradle文件夹,然后使用brew重新安装gradle;
gradle安装参考:https://gradle.org/
不报错的情况下,VSCode会下载一些必要资源,然后在目标设备(右下角选择的)上运行app;
至此,Flutter安装完毕,正常运行,接下来就是Flutter开发之旅了!
Recommend
About Joyk
Aggregate valuable and interesting links.
Joyk means Joy of geeK