美文网首页
Flutter:Mac下Flutter开发环境集成

Flutter:Mac下Flutter开发环境集成

作者: 丶墨墨丶 | 来源:发表于2019-05-28 15:12 被阅读0次
    Flutter

    Flutter 是为了跨平台而生的,所以为了验证在iOS和Android 的运行情况,必须先在mac 上配置好 iOS 的开发环境 Xcode 和 Android 的开发环境 Android Studio。这里我就不在展开写 Xcode 和 Android Studio 的安装配置过程了,这算是开发Flutter 的前提条件吧。另外,我个人更喜欢IntelliJ IDEA 的Flutter 开发环境,所以,将IDEA 的配置Flutter方法放在最后。

    下载flutter

    https://flutter.io/setup-macos/

    屏幕快照 2019-05-26 下午4.41.00.png

    配置环境变量

    先把刚才下载的flutter放到你想安装的目录下。配置环境变量,命令行:

    vim ~/.bash_profile
    
    屏幕快照 2019-05-26 下午4.54.43.png

    保存完毕之后运行命令:

    source ~/.bash_profile
    

    检查环境

    flutter doctor
    
    屏幕快照 2019-05-26 下午5.03.53.png

    按照检测结果的说明,如果有[!] ✗ 标志,表示本行检测不通过,需要做一些设置或者安装一些软件。

    Android Studio安装配置

    安装:
    https://developer.android.com/studio/index.html
    或者http://www.android-studio.org
    配置:
    Android Studio的配置非常简单:

    • 打开Android Studio -> Preference > Plugins
    • 在搜索框中搜索 Flutter
    • 本地没有, 就联网查找,搜索到Flutter, 点击安装即可
    • Dart环境他自动会安装好

    IntelliJ IDEA 配置 Flutter

    • 打开IntelliJ IDEA -> Preference > Plugins
    • 在搜索框中搜索 Flutter
    • 搜索到Flutter, 点击安装即可
    • Dart环境他自动会安装好


      屏幕快照 2019-05-26 下午5.17.02.png

      这样,IntelliJ IDEA 的 Flutter 开发环境就配置好了,接下来需要额外安装配置Dart语言的开发环境。

    Mac安装Dart的SDK

    flutter是基于Dart语言开发的,所以我们需要额外安装配置Dart语言的开发环境。
    使用brew(Homebrew)安装Dart:
    终端 依次执行

    brew tap dart-lang/dart
    brew install dart
    

    查看相关信息

    brew info dart
    

    在安装Dart的SDK过程中,提示Xcode版本过低(只要不是最新版本,貌似就会提示版本过低),由于更新Xcode10.2还需要更新mac系统,耗时费力。于是安装了Android Studio,安装Flutter插件,一路下来比较顺利,创建了第一个flutter工程:

    屏幕快照 2019-05-27 上午10.25.14.png
    运行效果:
    WechatIMG224.jpeg

    Android Studio体验还可以,flutter运行到iPhone的体验也还可以,个人感觉要比RN稍微好一点,考虑到Android、Flutter、Google之间的关系,也就很好解释了,,😄。IntelliJ IDEA开发Flutter工程的相关配置后续更新,由于平时写Java工程还是主要用idea,还是更倾向于使用IntelliJ IDEA,避免安装多个开发工具。

    其实安装完Android Studio,配置Flutter插件,Dart SDK也已经安装好了,在IntelliJ IDEA设置好Flutter SDK路径,就可以一路走通Flutter工程: 屏幕快照 2019-05-27 上午10.49.06.png 屏幕快照 2019-05-27 上午11.00.52.png

    我花了 8 小时,"掌握"了一下 Flutter | Flutter 中文站上线
    flutter环境配置详解MAC版
    https://www.jianshu.com/p/eb782589be82

    相关文章

      网友评论

          本文标题:Flutter:Mac下Flutter开发环境集成

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