Flutter - 安装流程

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 会输出类似以下信息:

2089290-364de9a4d8e89b6c.png
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

转载于:https://www.jianshu.com/p/79c1e8281532

猜你喜欢

转载自blog.csdn.net/weixin_34392435/article/details/91063530