Flutter开发实战--开发环境搭建

831 阅读3分钟

开发环境:macOS

1、设置环境变量

打开终端,然后打开环境变量配置文件,如果不加sudo可能没有权限

sudo vi ~/.bash_profile

编辑完之后,按ESC键,输入:wq保存退出,如果不想保存就输入:q

2、获取Flutter SDK

SDK下载页
下载完成后将其解压到你想安装的目录。

创建安装目录
mkdir Programfiles

进入该目录
cd ~/Programfiles

解压flutter安装包
unzip ~/Downloads/flutter_macos_v1.7.8+hotfix.3-stable.zip

本文安装目录为/Users/shanggushenpeng/Programfiles

3、添加flutter相关工具到path中

官方文档中给我们了一种临时设置path的方法就是

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

上面代码只能暂时针对当前命令行窗口设置PATH环境变量,要想永久将Flutter添加到PATH中,需要修改 .bash_profile 文件

重启终端或者执行source $HOME/.bash_profile刷新当前终端窗口。

4、运行flutter doctor

运行以下命令查看是否需要安装其它依赖项来完成安装

flutter doctor

该命令检查您的环境并在终端窗口中显示报告。Dart SDK已经在捆绑在Flutter里了,没有必要单独安装Dart。 仔细检查命令行输出以获取可能需要安装的其他软件或进一步需要执行的任务。

下面是我运行上述命令后输出结果的截图。

图片中信息提示电脑还没有安装Android SDK、Xcode以及iOS工具。

ps: 本人是一名前端程序员,所以电脑中没有配置过客户端开发相关工具。

先后安装Android studio和Xcode之后再次执行flutter doctor命令,得到下面输出信息。

根据提示的错误信息,执行下面命令:

flutter doctor --android-licenses

根据提示一直输入y即可。再次执行flutter doctor命令,得到下面输出信息。

现在还提示我们Xcode没有安装成功,需要我们执行下面命令。

sudo xcode-select --switch /Applications/Xcode.app/Contents/Developer

执行上面命令后得到下面错误:

xcode-select: error: invalid developer directory '/Applications/Xcode.app/Contents/Developer'

出现这个错误是因为第一次安装Xcode是从苹果官网下载的安装包,网上有人遇到同样问题,有两种解决方法(推荐第二种):

1、在APP Store中重新安装一次Xcode。(比较low)
2、将安装好的Xcode移动的应用程序里面,然后再次执行上面命令。(如果是Xcode-beta版本要重命名为Xcode)。

关于IOS tool的相关错误则根据提示一次执行下面命令:

    brew install --HEAD usbmuxd
    brew link usbmuxd
    brew install --HEAD libimobiledevice
    brew install ideviceinstaller
    brew install ios-deploy

再次执行flutter doctor命令,得到下面输出信息。

根据提示需要在Android Studio安装两个插件:

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

安装方法
1、启动Android Studio.
2、打开插件首选项 (Preferences>Plugins on macOS, File>Settings>Plugins on Windows & Linux).
3、选择 Browse repositories…, 选择 Flutter 插件并点击 install.
4、重启Android Studio后插件生效.

再次执行flutter doctor命令,得到下面输出信息。

现在我们flutter开发环境已经全部搭建完成。

参考文章

Flutter中文网
Mac Flutter 环境安装
在macOS上搭建Flutter开发环境~踩坑记录