搭建Mac Flutter开发环境
基于Mac M1 Pro搭建Flutter开发环境,其他平台请参考官方教程
1、Get started
电脑配置:建议8核16G,70G以上磁盘空间
系统要求:Flutter 支持 macOS 10.15 (Catalina) 或更高版本,zsh是的默认 shell。
如果是Apple M系列的芯片,需要安装 Rosetta 2,如果是Intel芯片,则忽略下面这段。
对于在搭载 Apple 芯片的 Mac 上开发和运行 Flutter 应用,某些 Flutter 组件或依赖可能需要通过 Rosetta 2 进行转换。Rosetta 2 是 Apple 提供的一个软件,它使 Mac 能够运行那些原本只为 Intel 处理器编写的应用程序。如果你在使用 M1 或其他 Apple 芯片的 Mac 时遇到了 Flutter 组件不兼容的问题,安装并启用 Rosetta 2 可以解决这一问题。
要启用 Rosetta 2,用户可以在 Mac 上打开终端(Terminal)应用程序,并输入以下命令:
sudo softwareupdate --install-rosetta --agree-to-license
安装完成后,Rosetta 2 将在后台运行,无需进行任何额外配置。这样,你就可以在 Apple 芯片的 Mac 上无缝地使用 Flutter 开发工具和其他组件了。
2、安装开发工具
- 1、安装Xcode
从 App Store 安装 Xcode最新版本,Xcode 用于调试和编译本机 Swift 或 ObjectiveC 代码,安装包括 Git 2.27 或更高版本来管理源代码。
安装好Xcode还需要设置 Xcode 的开发目录和签署许可协议, 执行下面命令,
sudo sh -c 'xcode-select -s /Applications/Xcode.app/Contents/Developer && xcodebuild -runFirstLaunch'
签署许可协议
sudo xcodebuild -license
- 2、安装CocoaPods
如果你的 Flutter 应用不需要任何 iOS 原生依赖,那么你就不需要安装 CocoaPods。但是,如果你计划使用 iOS 平台的特定功能或集成第三方原生库,那么安装 CocoaPods 是必要的。
如果没有安装 Ruby,或者版本过旧,你可以使用 Homebrew 安装:
brew install ruby
使用以下命令在终端中安装 CocoaPods:
sudo gem install cocoapods
安装完成后,你可以通过运行pod --version命令来检查 CocoaPods 是否安装成功
- 3、安装iOS模拟器
打开终端:使用以下命令下载并安装 iOS 模拟器:
xcodebuild -downloadPlatform iOS
这个命令会触发 Xcode 从 App Store 或其他源下载 iOS 模拟器所需的组件,如果它们尚未安装。
运行模拟器启动命令: 使用以下命令启动 iOS 模拟器:
open -a Simulator
这个命令通过 open
命令启动名为 "Simulator" 的应用程序,这是 Xcode 提供的 iOS 模拟器的正式名称。
- 4、IDE集成开发环境
您可以使用任何文本编辑器或集成开发环境 (IDE) 结合 Flutter 的命令行工具来构建 Flutter 应用程序。比较受欢迎的IDE:Visual Studio Code、Android Studio、IntelliJ IDEA
Flutter 团队建议安装 Visual Studio Code 1.77 或更高版本以及 VS Code 的 Flutter 扩展。这种组合简化了 Flutter SDK 的安装。
3、安装Flutter SDK
安装 Flutter SDK 是开始使用 Flutter 开发应用的第一步。以下是两种常见的安装方法:
使用 VS Code Flutter 扩展安装
-
安装 Visual Studio Code:
-
如果你还没有安装 Visual Studio Code (VS Code),你需要先从 VS Code 官网 下载并安装。
-
-
安装 Flutter 扩展:
-
打开 VS Code。
-
转到扩展视图,可以通过点击侧边栏的扩展图标或按下
Ctrl+Shift+X
(在 macOS 上是Cmd+Shift+X
)。 -
搜索 “Flutter”。
-
找到 Flutter 扩展(通常由 Dart Code 提供)并点击安装。
-
-
安装 Flutter SDK:
- 安装 Flutter 扩展后,它会引导你安装 Flutter SDK。按照扩展中的指示完成安装。
- 如果没有提示,可以通过按
Command + Shift + P
打开命令面板,输入flutter,从下拉列表中选择Flutter: New Project
命令,如果您还没有安装 Flutter SDK,可以选择Download SDK
Flutter SDK下载可能有网络问题,需要自行解决或者手动到Flutter镜像站点下载 Flutter SDK 压缩包
- 配置 环境变量:
打开终端。使用文本编辑器打开 .zshrc
文件,例如使用 nano
:
nano ~/.zshrc
在文件的末尾添加上述 export
命令:
export PATH="$PWD/flutter/bin:$PATH"
- 请确保替换
$PWD/flutter/bin
为 Flutter SDK 的实际路径。如果 Flutter SDK 不在当前目录下,你需要提供正确的绝对路径。 - 保存并关闭
.zshrc
文件。 - 为了让更改生效,你需要运行以下命令来重新加载
.zshrc
文件:
source ~/.zshrc
或者,你可以使用 echo
命令直接将 export 行添加到 .zshrc
文件中,这样做会自动保留文件中的其他内容:
echo 'export PATH="$PWD/flutter/bin:$PATH"' ~/.zshrc
记得替换 $PWD/flutter/bin
为 Flutter SDK 的实际路径。
手动下载并安装 Flutter SDK
-
下载 Flutter SDK:
-
访问 Flutter 官网 并导航到下载页面。
-
根据你的操作系统选择相应的安装包并下载。
-
-
解压 Flutter SDK:
-
将下载的压缩包解压到一个合适的目录。
-
-
配置 环境变量:
-
将 Flutter 的 bin 目录添加到你的环境变量
PATH
中。这样可以在终端或命令提示符中直接使用 Flutter 命令。参考上面👆
-
-
检查环境:
- 在终端或命令提示符中运行
flutter doctor
来验证安装并检查是否需要进行额外的配置。
- 在终端或命令提示符中运行
-
安装 Dart 插件(如果你使用 VS Code):
- 即使不通过 VS Code 安装 Flutter,如果你选择使用 VS Code 作为你的开发环境,你也应该安装 Dart 插件,它为 Flutter 开发提供了额外的支持和功能。
-
开始一个新的 Flutter 项目:
-
使用命令
flutter create project_name
创建一个新的 Flutter 项目。
-
-
运行你的 Flutter 应用:
-
进入项目目录,使用命令
flutter run
运行你的 Flutter 应用。
-
选择哪种安装方式取决于你的个人喜好和开发环境需求。使用 VS Code Flutter 扩展安装可以提供更集成的体验,而手动安装则给了你更多的控制权和灵活性。无论哪种方式,确保按照 Flutter 官方文档的指导进行操作,以避免潜在的问题。
4、第一个Flutter App
-
打开命令面板:
- 在 VS Code 中,通过菜单
View > Command Palette
或按下Ctrl + Shift + P
(在 macOS 上是Cmd + Shift + P
)打开命令面板。
- 在 VS Code 中,通过菜单
-
搜索 Flutter 命令:
- 在命令面板中输入
flutter
来过滤与 Flutter 相关的命令。
- 在命令面板中输入
-
创建新项目:
- 从下拉列表中选择
Flutter: New Project
命令。
- 从下拉列表中选择
-
选择项目类型:
- 当提示选择 Flutter 项目类型时,选择
Application
。
- 当提示选择 Flutter 项目类型时,选择
-
设置项目位置:
- 创建或选择一个父目录,这将是新项目文件夹的存放位置。
-
命名项目:
- 当提示输入项目名称时,输入
test
或你选择的任何名称。
- 当提示输入项目名称时,输入
-
完成项目创建:
-
按下
Enter
键,VS Code 将开始创建 Flutter 项目。这可能需要一些时间。
-
选择设备并启动应用
-
打开命令面板:
- 通过菜单
View > Command Palette
或按下Ctrl + Shift + P
(在 macOS 上是Cmd + Shift + P
)打开命令面板。
- 通过菜单
选择设备并启动应用
-
搜索 Flutter 命令:
- 在命令面板中输入
flutter
来过滤与 Flutter 相关的命令。
- 在命令面板中输入
-
选择设备:
- 选择
Flutter: Select Device
命令。这将列出当前可用的设备,包括模拟器和连接的物理设备。
- 选择
-
启用设备:
- 如果没有运行的设备,系统会提示您启用一个设备。您可以选择启动一个模拟器或连接一个物理设备。
-
选择目标设备:
- 从提示中选择一个目标设备。这将作为 Flutter 应用的运行目标。
启动应用
-
开始调试:
-
选择设备后,您可以通过多种方式启动应用:
- 通过菜单
Run > Start Debugging
,或者 - 按下
F5
键(取决于您的键盘设置,可能需要同时按下Ctrl
)。
- 通过菜单
-
-
等待应用启动:
- 应用将开始构建并启动在选定的设备上。
监控调试控制台
-
查看调试控制台:
- 应用启动过程中的输出和日志可以在 VS Code 的调试控制台(Debug Console)视图中查看。
-
调试应用:
-
如果您设置了断点,应用将在断点处暂停,允许您检查变量、调用堆栈等。
-
转载自:https://juejin.cn/post/7363534953650733065