美文网首页
flutter入门

flutter入门

作者: 妄自 | 来源:发表于2020-01-06 10:07 被阅读0次

以下教程以mac配置为主

1、sdk获取()
git clone -b master https://github.com/flutter/flutter.git

 ./flutter/bin/flutter --version
2、国内需要设置镜像
export PUB_HOSTED_URL=https://pub.flutter-io.cn //(国内用户需设置)

export FLUTTER_STORAGE_BASE_URL=https://storage.flutter-io.cn //(国内用户需设置)
3、路径配置(此路径为自己flutter文件夹路径)
export PATH=$PATH:/Users/yijiaanhao/Desktop/flutter/flutter/bin
4、执行 flutter doctor

此时可能出现以下情况:

Flutter plugin not installed; this adds Flutter specific functionality.
✗ Dart plugin not installed; this adds Dart specific functionality.

image.png
5、android studio flutter 配置

在android studio 界面点击Preferences>Plugins:搜索 flutterdart并安装、重启android studio。

image.png
6、flutter Path配置

bash_profile编辑添加:

export PATH=[你Git的flutter工程目录]/flutter/bin:$PATH

eg:

image

运行以下命令行进行刷新:

source ~/.bash_profile

运行以下命令验证flutter/bin目录在PATH中:

echo $PATH

三、iOS环境依赖

需要通过homebrew安装用于将Flutter应用程序部署到iOS设备的环境和工具:

brew install --HEAD libimobiledevice
brew install ideviceinstaller ios-deploy cocoapods

不同情况下回 遇到很多不同情况,如果不成功可以通过flutter doctor来定位问题

四、创建一个Flutter项目

经过上面三部环境基本上差不多了,现在来建立一个Flutter项目。
进入你想存放项目的目录,执行命令行:

flutter create flutterapp  *切记不要大写!!!
五、在flutterapp目录下,cmd输入
flutter run 

这个时候会提示你所连接真机的信息,如下图,其中*后面的为手机id


image.png
6、执行命令行flutter run -d 手机id 等待一段时间后便会在你手机上运行项目

eg:

flutter run -d 0167B477-B0CC-4FAD-8403-837FC941500B
7、热重载功能

下载vscode,并安装flutter插件,然后点击下方绿色按钮,会在需要安装一些配置环境,等安装完成后,vscode会自动连接xcode的模拟机(安卓应该同样如此)。


image.png

此时当你改动main.dart里面的代码时,你会发现页面已经自动刷新。


image.png
image.png

后面我会继续写一些关于flutter操作,大家一起进步!!!

相关文章

网友评论

      本文标题:flutter入门

      本文链接:https://www.haomeiwen.com/subject/nropoctx.html