Flutter macOS安装使用

flutter 作为Dart在移动端的一个跨平台SDK,它可以在Windows,macOS,Lunux中安装使用,随着稳定版本的发布和它开源的特性,越来越多的开发者开始使用,作为Google大力推广的一个跨平台开发工具,可以遇见它的强大和发展因此我们有必要对它进行一番探索。我用的是macOS所以这篇是介绍flutter在macOS中的安装使用操作。

1. 系统最低需求

  • macOS 64-bit
  • 磁盘空间最低700M。(注意这里不包含IDE和相关插件工具,后续会介绍需要安装Xcode,Android Studio,磁盘容量最好不要低于20G)
  • 相关命令行工具:
    • bash
    • curl
    • git 2.x
    • mkdir
    • rm
    • unzip
    • which

2. Flutter SDK 安装

  1. 下载flutter_macos_v1.2.1-stable.zip 更多版本记录下载请移步官方下载地址

  2. 把刚才下载的压缩包解压并移至相关位置。(这个位置很重要,后面要用到所以不要随便放置)例如:

    cd ~/development
    $ unzip ~/Downloads/flutter_macos_v1.2.1-stable.zip
    
  3. 添加flutter 工具至PATH环境变量,终端执行:

     export PATH="$PATH:`pwd`/flutter/bin"
    

    这种方式只能在当前终端窗口PATH有效,如果要永久有效需要采用另外一种方式:

    1. 打开或新建 $HOME/.bash_profile文件,如果你使用的是zsh,执行vim $HOME/.zshrc

    2. 把下面这行添加至上面的文件中

      export PATH="$PATH:你放置flutter的文件目录/flutter/bin"
      
    3. 运行source $HOME/.bash_profile 或者是source $HOME/.zshrc(具体运行请根据步骤1中过来)

    4. 检查flutter/bin 是否在你的PATH环境变量中,运行:echo $PATH

  4. 如果PATH环境变量中已经添加了flutter/bin 终端执行flutter doctor检测下,如果你Xcode和Andriod Studio都已经安装配置好,基本没什么问题了。会出现下面的提示:

    ~ » flutter doctor                                                                                                                                                                                                                                                                                     perry@PerryiMac
    Doctor summary (to see all details, run flutter doctor -v):
    [✓] Flutter (Channel beta, v0.7.3, on Mac OS X 10.14 18A391, locale zh-Hans-CN)
    [✓] Android toolchain - develop for Android devices (Android SDK 28.0.2)
    [✓] iOS toolchain - develop for iOS devices (Xcode 10.1)
    [✓] Android Studio (version 3.3)
    [✓] Connected devices (1 available)
    
    • No issues found!
    

    如果有问题请按照提示进行跟新,安装。

Xcode 和Android Studio 设置

Xcode

  1. Xcode去Mac App Store下载最新版的就可以了。

  2. 下载完成后配置Xcode 命令行工具。终端运行:

    sudo xcode-select --switch /Applications/Xcode.app/Contents/Developer
    
  3. 同意相关许可声明:终端运行 sudo xcodebuild -license

  4. 设置iOS模拟器,终端运行:open -a Simulator打开模拟器后,在Hardware->Device 选择相关型号模拟器为64-bit,iPhone5+。

  5. 如果要在真机上运行测试,需要额外安装一些工具

    1. 安装home brew 终端运行:终端运行/usr/bin/ruby -e "$(curl -fsSL https://raw.githubusercontent.com/Homebrew/install/master/install)"

    2. 依次运行,(网速快还好,网速慢久耐心等待吧..)

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

Andriod Studio

  1. 下载Android Studio 官方下载地址 (注意官方下载地址需要翻墙)
  2. 下载完成后,根据向导安装最新的Android SDK、Android SDK Platform-Tools,和Android SDK Build-Tools。
  3. 添加模拟器。

创建运行Flutter APP

  1. 终端输入flutter create my_app

  2. 创建好后,终端进入my_app文件夹。

  3. 打开iOS或Android模拟器,在终端运行flutter run

运行结果:

Untitled.gif

编辑器

Flutter使用Dart进行编码编辑器官方推荐的有三种,Android Studio, IntelliJ, VS Code,这里介绍Android Studio

  • 安装Flutter和Dart plugins
    • 启动Andriod studio
    • 选择Andriod studio-> Preferences > Plugins
    • 在新窗口中选择Browse repositories
    • 选择Flutter plugin点击安装


      屏幕快照 2019-02-27 下午5.08.55.png

推荐阅读更多精彩内容