初体验遇到的问题

下载 Flutter SDK 并配置环境变量

Flutter 的 SDK 需要独立下载,需要去 https://flutter.cn/docs/development/tools/sdk/releases?tab=macos 下载最近的 sdk,放到某个目录。

然后解压,并配置环境变量。

exportPATH="$PATH:`pwd`/flutter/bin"source~/.zshrc  #替换你自己的 shell 配置文件路径

Flutter 依赖一些其他的工具,可以运行flutter doctor命令来查看依赖是否完善。

拿我的电脑举例:

➜  flutter git:(stable)flutter doctorDoctorsummary(to see all details,run flutter doctor-v):[✓]Flutter(Channel stable,v1.9.1+hotfix.2,on Mac OS X10.1418A391,locale    zh-Hans-CN)[!]Android toolchain-developforAndroiddevices(Android SDK version28.0.3)!Some Android licenses not accepted.To resolvethis,run:flutter doctor--android-licenses[!]Xcode-developforiOS andmacOS(Xcode10.1)!CocoaPods outofdate(1.6.0is recommended).CocoaPods is used to retrieve the iOS and macOS platform side's plugin        code that responds to your plugin usage on the Dart side.Without CocoaPods,plugins will not work on iOS or macOS.For more info,see https://flutter.dev/platform-plugins      To upgrade:sudo gem install cocoapods        pod setup[!]AndroidStudio(version3.5)✗ Flutter plugin not installed;thisadds Flutter specific functionality.✗ Dart plugin not installed;thisadds Dart specific functionality.[✓]VSCode(version1.33.0)[!]Connected device!No devices available!Doctor found issuesin8categories.

flutter doctor 检查出了几个问题:

问题 1:Some Android licenses not accepted.  To resolve this, run:

flutter doctor--android-licenses

然后按提示输入y,直到所有的 licenses 都被 ac,到最后展示成这样。

Accept?(y/N):yAll SDKpackagelicenses accepted

问题 2:CocoaPods out of date (1.6.0 is recommended). To upgrade:

sudo gem install cocoapods

pod setup

第一步会安装 cocoapods  各种工具,第二步骤会 Setting up CocoaPods master repo。

耐心等待即可。

最后看到这个就算对了:

CocoaPods1.8.0.beta.2is available.To update use:`sudo gem install cocoapods --pre`[!]This is a test version we'd love you totry.For more information,see https://blog.cocoapods.org and the CHANGELOGforthisversion at https://github.com/CocoaPods/CocoaPods/releases/tag/1.8.0.beta.2Setup completed

问题 3

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

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

解法,在 AS 安装一下 Flutter 插件。

再次验证下:

➜~flutter doctorDoctorsummary(to see all details,run flutter doctor-v):[✓]Flutter(Channel stable,v1.9.1+hotfix.2,on Mac OS X10.1418A391,locale    zh-Hans-CN)[✓]Android toolchain-developforAndroiddevices(Android SDK version28.0.3)[✓]Xcode-developforiOS andmacOS(Xcode10.1)[✓]AndroidStudio(version3.5)[✓]VSCode(version1.33.0)[✓]Connecteddevice(1available)

可以看到,必须的都已经 OK 了。

配置 iOS 开发环境

安装 Xcode,在 AppStore 下载即可,要求 9.0 及以上

配置 Xcode command-line tools :sudo xcode-select --switch /Applications/Xcode.app/Contents/Developer

运行一次 Xocde 或者通过输入命令sudo xcodebuild -license来确保已经同意 Xcode 的许可协议。

如果以前下载过 Xcode 用过终端,那么应该没问题。

然后启动一个 iPhone5S 之后版本的模拟器,我选了 XS。

open-a Simulator

创建一个 Flutter 工程,并部署到模拟器。

flutter create helloflutter

cd helloflutter

flutter run

执行上面三个命令就可以创建并部署到模拟器。

创建的工程目录:

➜  helloflutter lltotal32-rw-r--r--1mingjue  staff54291115:48README.mddrwxr-xr-x12mingjue  staff38491115:58androiddrwxr-xr-x9mingjue  staff28891116:00build-rw-r--r--1mingjue  staff89691115:48helloflutter.imldrwxr-xr-x8mingjue  staff25691115:49iosdrwxr-xr-x3mingjue  staff9691115:48lib-rw-r--r--1mingjue  staff327991115:48pubspec.lock-rw-r--r--1mingjue  staff266491115:48pubspec.yamldrwxr-xr-x3mingjue  staff9691115:48test

注:代码放在 lib/ 下面。

运行日志:

➜  helloflutter flutter runLaunching lib/main.dart on iPhone XSindebug mode...Running Xcode build...├─Assembling Flutter resources...8.0s └─Compiling,linking and signing...15.2sXcode build done.26.1sSyncing files to device iPhone XS...2,387ms(!)?To hot reload changeswhilerunning,press"r".To hotrestart(and rebuildstate),press"R".An Observatorydebuggerand profiler on iPhone XS is available at:http://127.0.0.1:49877/1KhXC2nzaFc=/For a more detailed help message,press"h".To detach,press"d";to quit,press"q".

跑起来如图:

注意:如果要部署到真机,还需要开发者账号,我没有就没试。

配置 Android 开发环境

Android 也有模拟器跟真机的选择,鉴于 Android 模拟器的性能,我选择了真机。

真机跟普通的 Android 开发差不多,开启开发者模式,允许 USB debugging 即可。

然后运行flutter devices命令确保 Flutter 可以识别我们的设备。

同 iOS,运行 flutter run 部署到 Android 手机上。

➜  helloflutter flutter run-d 91ab18e5Launching lib/main.dart on MI NOTE LTEindebug mode...Initializing gradle...17.3sResolving dependencies...81.4sRunning Gradle task'assembleDebug'...Running Gradle task'assembleDebug'...Done43.2sBuilt build/app/outputs/apk/debug/app-debug.apk.Installing build/app/outputs/apk/app.apk...18.5sSyncing files to device MI NOTE LTE...2,104ms(!)?To hot reload changeswhilerunning,press"r".To hotrestart(and rebuildstate),press"R".An Observatorydebuggerand profiler on MI NOTE LTE is available at:http://127.0.0.1:50410/wvUWXqgNfBE=/For a more detailed help message,press"h".To detach,press"d";to quit,press"q".

在 Android 上启动截图:

注:当电脑连着多个设备或模拟器时,flutter run 可以通过 -d deviceId 来指定要 run 到哪个设备,例如flutter run -d 91ab18e5,或者flutter run -d all部署到所有的设备。

©著作权归作者所有,转载或内容合作请联系作者
【社区内容提示】社区部分内容疑似由AI辅助生成,浏览时请结合常识与多方信息审慎甄别。
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

相关阅读更多精彩内容

  • Making it easy to add Flutter to an existing app is work ...
    共田君阅读 5,995评论 0 2
  • 本文先介绍一下现有工程如何集成 Flutter 实现混合开发,以及混合项目如何打包,再探索下如何降低原生和 Flu...
    koin447阅读 11,004评论 1 37
  • 我是小团子 这个名字伴随着我度过了整整六年 哦不对 应该说是整整一辈子 小时候不懂事倒没什么 可稍微大了一些后 就...
    面瘫书生阅读 3,991评论 0 0
  • 白天抽空和媳妇去看了《哪吒之魔童降世》,笑中有泪,想的最多的还是什么时候能够带哼哼和曦曦看个电影。 相对于电影本身...
    张大箱阅读 1,310评论 0 2
  • 人生难的 心事是装满桶的水,有一点缝隙都会外溢。痛就痛了,痛,让你认识自己,也看清了别人。败就败了,站起来拍拍灰尘...
    豫草根阅读 1,729评论 0 0

友情链接更多精彩内容