Flutter环境配置

参考官网:https://flutterchina.club/setup-macos

一、Flutter环境配置

1、使用镜像
mac终端编辑.bash_profile:

vi ~/.bash_profile

加入镜像路径:

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

官网提供的临时镜像,参考获取最新镜像:
https://github.com/flutter/flutter/wiki

2、获取Flutter SDK
链接:https://github.com/flutter/flutter/releases
下载安装包并解压到想安装的目录:

flutter.png

3、编辑~/.bash_profile
添加flutter相关工具到path中:

export PATH=/Users/yanghaibo/flutter/flutter/bin:$PATH

设置后执行命令使配置生效:

source ~/.bash_profile

查看flutter是否在PATH中:

echo $PATH

4、运行flutter doctor命令查看是否需要安装其它依赖项来完成安装。

doctor.png

该命令还会扫描xcode、Android Studio、IntelliJ IDEA等如果Mac安装的有。开发中我使用的是:Android Studio。

5、安装Android Studio,打开偏好设置preference添加flutter、dart插件。
如下图:

plugins.png

安装完成运行flutter doctor检测是否安装成功:

check.png

安装完成。

二、使用Android Studio创建工程

1、安装完成之后打开Android Studio,会出现Start a new Flutter project选项:

create.png

2、点击选择Flutter Application创建新工程:

new.png

3、设置工程名称,使用下划线形式命名:

name.png

注意文件路径最好使用英文命名,否则会报编码错误问题。

4、点击下一步,点击Finish直接创建。

finish.png

需要稍微等待一下。

5、创完成,首先没有设备模拟器,需要添加模拟器。

devices.png

选择安装模拟器:

add.png

6、运行工程。
安卓模拟器运行:

Android.png

选择苹果模拟器,使用的是xcode自带的模拟器:

iOS.png

三、使用命令创建工程

将flutter应用安装到iOS设备的工具

brew update
brew install --HEAD libimobiledevice
brew install ideviceinstaller ios-deploy cocoapods
pod setup

1、创建一个应用,注意不要大写
创建应用:

flutter create fiistapp

运行:

flutter run

多模拟器,需要选择模拟器运行:

flutter run -d 748770E3-83A2-4960-9B5D-9FD37EC7BE89
遇见错误

错误一:
ideviceinfo returned an error:
ERROR: Could not connect to lockdownd, error code -3

先修改lockdownd权限

sudo chmod -R 777 /var/db/lockdown

卸载之前的ideviceinstaller和libimobiledevice 重新安装并授权即可

brew update
brew uninstall --ignore-dependencies libimobiledevice
brew uninstall --ignore-dependencies usbmuxd
brew install --HEAD usbmuxd
brew unlink usbmuxd
brew link usbmuxd
brew install --HEAD libimobiledevice
brew install ideviceinstaller

错误二:
更新Android studio后出现的错误:
error.png
根据提示查看配置环境:

flutter doctor -v

look.png
查看以上也没有什么问题,谷歌一下发现是选择通道问题需要选择master通道。
查看当前通道:

flutter channel

切换通道:

flutter channel master

查看通道,当前环境下我的在stable上:
switch.png
查看当前通道:
channel.png
在运行就跑起来了
run.png

Android Studio快捷键:
https://developer.android.google.cn/studio/intro/keyboard-shortcuts

Flutter中使用的icon:
https://material.io/tools/icons/?style=round

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值