美文网首页
Flutter - 安装流程

Flutter - 安装流程

作者: 沙琪玛dd | 来源:发表于2019-06-06 10:15 被阅读0次

    Flutter 安装流程

    系统要求

    要安装并运行Flutter,您的开发环境必须满足以下最低要求:

    操作系统: macOS (64-bit)
    磁盘空间: 700 MB (不包括Xcode或Android Studio的磁盘空间).
    工具: Flutter 依赖下面这些命令行工具.
    bash, mkdir, rm, git, curl, unzip, which

    获取 Flutter SDK

    1. 下载最新的 Flutter SDK. 或者自己选择指定版本的 sdk

    2. 下载好 zip 文件后,将 zip 拷贝到自己想要存放的目录,然后解压。比如我的安装目录是用户目录下的新建 develop 文件夹中的 flutter 文件夹:/Users/kira/Develop/flutter

    unzip ~/Develop/flutter/flutter_macos_v1.5.4-hotfix.2-stable.zip
    
    1. 添加 flutter 相关工具到 Path 中。文件安装目录包括之后提到的示范中,都是 /Users/kira/Develop/flutter。
    export PATH=$PATH:/Users/kira/Develop/flutter/bin
    

    如果执行成功了,那么继续在终端中输入 flutter doctor 会输出类似以下信息:

    flutter doctor.png

    目前只能在当前目录下执行 flutter 命令,想永久把 flutter 添加到PATH中请参考下面更新环境变量部分

    1. 更新环境变量
      如果需要把 flutter 全局访问,那么我们需要首先把设置环境变量的命令添加到执行的文件中。

    打开或者创建 ~/.bash_profile 文件,然后往文件中添加一下内容

    export PUB_HOSTED_URL=https://pub.flutter-io.cn
    export FLUTTER_STORAGE_BASE_URL=https://storage.flutter-io.cn
    export PATH=~/Develop/flutter/bin:$PATH
    

    上面两行是国内用户需要设置,最后一行也是按照格式输入内容就好。默认的 flutter 安装目录还是 /Users/kira/Develop/flutter。
    在添加内容之后,运行 source $HOME/.bash_profile 刷新当前终端窗口。

    然后退出到任何目录,再次执行 flutter doctor 命令,如果生效则说明环境变量修改成功了。

    然后可以根据 flutter doctor 检测提示未完成的 issue,根据提示继续配好环境。

    平台设置

    以下以 iOS 平台为例

    1. 下载好 Xcode7.2或更高版本

    2. 配置Xcode命令行工具以使用新安装的Xcode版本 sudo xcode-select --switch /Applications/Xcode.app/Contents/Developer 对于大多数情况,当您想要使用最新版本的Xcode时,这是正确的路径。如果您需要使用不同的版本,请指定相应路径。

    3. 确保Xcode许可协议是通过打开一次Xcode或通过命令sudo xcodebuild -license同意过了.

    使用Xcode,您可以在iOS设备或模拟器上运行Flutter应用程序。

    安装到模拟器或者真机

    • 安装到模拟器
    1. 在Mac上,通过Spotlight或使用以下命令找到模拟器:
    open -a Simulator
    
    1. 运行 flutter run启动您的应用。
    • 安装到真机
    brew update
    brew install --HEAD libimobiledevice
    brew install ideviceinstaller ios-deploy cocoapods
    pod setup
    

    配置编辑器

    编辑器可以使用 Android Studio 或者 Visual Studio Code。两个都比较方便,可以安装 Flutter 的插件进行开发。

    Android Studio 安装

    安装Flutter和Dart插件

    需要安装两个插件:

    Flutter插件: 支持Flutter开发工作流 (运行、调试、热重载等).
    Dart插件: 提供代码分析 (输入代码时进行验证、代码补全等).

    要安装这些:

    启动Android Studio.
    打开插件首选项 (Preferences>Plugins on macOS, File>Settings>Plugins on Windows & Linux).

    选择 Browse repositories…, 选择 Flutter 插件并点击 install.

    重启Android Studio后插件生效.

    VS Code 安装

    安装Flutter插件

    启动 VS Code

    调用 View>Command Palette…

    输入 ‘install’, 然后选择 Extensions: Install Extension action

    在搜索框输入 flutter , 在搜索结果列表中选择 ‘Flutter’, 然后点击 Install

    选择 ‘OK’ 重新启动 VS Code

    通过Flutter Doctor验证您的设置

    调用 View>Command Palette…

    输入 ‘doctor’, 然后选择 ‘Flutter: Run Flutter Doctor’ action

    查看“OUTPUT”窗口中的输出是否有问题

    体验

    Android Studio

    创建新应用

    选择 File>New Flutter Project

    选择 Flutter application 作为 project 类型, 然后点击 Next
    输入项目名称 (如 myapp), 然后点击 Next

    点击 Finish

    等待Android Studio安装SDK并创建项目.

    上述命令创建一个Flutter项目,项目名为myapp,其中包含一个使用Material 组件的简单演示应用程序。

    在项目目录中,您应用程序的代码位于 lib/main.dart.

    运行应用程序

    VS Code

    启动 VS Code

    调用 View>Command Palette…

    输入 ‘flutter’, 然后选择 ‘Flutter: New Project’ action

    输入 Project 名称 (如myapp), 然后按回车键

    指定放置项目的位置,然后按蓝色的确定按钮

    等待项目创建继续,并显示main.dart文件

    上述命令创建一个Flutter项目,项目名为myapp,其中包含一个使用Material 组件的简单的演示应用程序。

    在项目目录中,您的应用程序的代码位于 lib/main.dart.

    运行应用程序

    确保在VS Code的右下角选择了目标设备

    按 F5 键或调用Debug>Start Debugging
    等待应用程序启动

    最后

    应用启动完成后,基本环境就算搭建好了。(其实这篇只能算是笔记,具体参照参考资料给出的官方链接)

    参考资料

    入门: 在macOS上搭建Flutter开发环境

    MacOS install

    相关文章

      网友评论

          本文标题:Flutter - 安装流程

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