Mac 电脑搭建 Flutter iOS 环境及项目运行全攻略
目录
Mac 电脑搭建 Flutter iOS 环境及项目运行全攻略
一、搭建前的准备工作
（一）升级 Mac 系统
（二）安装 Xcode
（三）安装 Homebrew
（四）安装 Chrome 浏览器（可选）
二、下载和配置 Flutter SDK
（一）确定下载版本
（二）下载 Flutter SDK
（三）解压和配置
（四）配置环境变量
（五）检查 Flutter 环境
三、安装 CocoaPods
四、创建和运行 Flutter iOS 项目
（一）创建项目
（二）修改项目权限
（三）在 Xcode 中运行项目
（四）在 VS Code 中开发项目
（五）热加载和热重启
（六）在不同平台运行项目
在移动应用开发领域，Flutter 凭借其出色的跨平台特性，成为众多开发者的首选框架。对于使用 Mac 电脑的开发者而言，搭建 Flutter iOS 开发环境并让应用在 iOS 设备和 Mac 桌面软件上运行，是开启高效开发之旅的关键一步。本文将详细介绍整个搭建和运行过程，让你轻松上手。
一、搭建前的准备工作
（一）升级 Mac 系统
确保你的 Mac 系统是最新版本，这能保证系统的稳定性和兼容性。打开 “系统偏好设置”，点击 “软件更新”，按照提示进行升级操作。
（二）安装 Xcode
Xcode 是苹果开发的集成开发环境，是搭建 Flutter iOS 环境的必备工具。打开 App Store，在搜索框中输入 “Xcode”，点击 “获取” 进行安装。如果之前已安装，可在 App Store 中查看是否有更新并进行升级。
（三）安装 Homebrew
Homebrew 是 Mac 系统下的包管理器，方便安装各种软件和工具。打开浏览器，访问Homebrew 官网，官网提供了安装命令，选择适合你系统的命令（一般为官方推荐的默认命令），复制后打开终端，粘贴命令并回车。过程中可能需要输入电脑密码，输入后等待安装完成。
/bin/bash -c "$(curl -fsSL https://raw.githubusercontent.com/Homebrew/install/HEAD/install.sh)"
（四）安装 Chrome 浏览器（可选）
若你打算开发 Web 应用，Chrome 浏览器是不错的选择。同样在 App Store 中搜索 “Chrome” 进行安装。
二、下载和配置 Flutter SDK
（一）确定下载版本
不同芯片架构的 Mac 电脑需要下载对应的 Flutter SDK 版本。打开终端，输入以下命令查看芯片架构：
uname -m
如果返回 “x86_64”，则下载 x64 版本的 Flutter SDK；如果返回 “arm64”，则下载 arm64 版本。
（二）下载 Flutter SDK
访问Flutter 官网，找到对应版本的 SDK 下载链接，点击下载。
（三）解压和配置
下载完成后，文件会自动解压。将解压后的文件夹移动到你希望存放的目录，例如 “~/Documents/flutter_sdk” 。
（四）配置环境变量
在 Mac 系统中，需要编辑配置文件来设置 Flutter SDK 的环境变量。在新版本的 Mac OS 中，需要编辑 “~/.bash_profile” 和 “~/.zshrc” 这两个文件。
- 编辑 “~/.bash_profile” 文件：在终端中输入以下命令：
vim ~/.bash_profile
进入编辑模式后（按下 “i” 键），添加以下内容（注意将 “/Users/yourusername/Documents/flutter_sdk/bin” 替换为你实际的 Flutter SDK 路径）：
export PATH="$PATH:/Users/yourusername/Documents/flutter_sdk/bin"
export PUB_HOSTED_URL=https://pub.flutter-io.cn
export FLUTTER_STORAGE_BASE_URL=https://storage.flutter-io.cn
添加完成后，按下 “Esc” 键，输入 “:wq” 并回车保存退出。
2. 编辑 “~/.zshrc” 文件：同样在终端中输入：
vim ~/.zshrc
添加与 “~/.bash_profile” 中相同的内容，保存退出。
3. 使配置生效：在终端中依次执行以下命令，让配置生效：
source ~/.bash_profile
source ~/.zshrc
（五）检查 Flutter 环境
在终端中输入以下命令检查 Flutter 环境是否配置成功：
flutter doctor
首次运行可能会提示一些错误信息，如安卓相关的错误，因为我们主要搭建 iOS 环境，这些可以先忽略。重点关注 Xcode 相关的提示，如果没有提示 “flutter 不是内置命令”，则说明 Flutter SDK 已配置成功。
三、安装 CocoaPods
CocoaPods 是 iOS 开发中的依赖管理工具，在 Flutter iOS 开发中也很重要。
- 安装 CocoaPods：在终端中输入以下命令安装 CocoaPods：
brew install cocoapods
- 初始化 CocoaPods：安装完成后，执行以下命令进行初始化：
pod setup
- 再次检查 Flutter 环境：执行 “flutter doctor” 命令，按照提示执行相关命令解决可能出现的问题，直到没有关于 CocoaPods 的提示。
四、创建和运行 Flutter iOS 项目
（一）创建项目
打开终端，使用 “cd” 命令进入你希望创建项目的目录，例如 “cd ~/Documents/flutter_demo” 。然后输入以下命令创建项目（注意添加 “sudo” 获取管理员权限）：
sudo flutter create your_project_name
输入电脑密码后等待项目创建完成。
（二）修改项目权限
项目创建完成后，需要修改项目目录的权限。在终端中输入以下命令（将 “your_project_name” 替换为实际项目名称）：
chmod -R 777 your_project_name
（三）在 Xcode 中运行项目
- 打开 Xcode，找到项目目录中的 “ios” 文件夹，点击 “Runner.xcworkspace” 文件打开项目。
- 在 Xcode 中选择一个模拟器版本，如 “iPhone 8” ，点击运行按钮。首次运行可能会较慢，因为需要安装模拟器操作系统，耐心等待项目在模拟器中启动。
（四）在 VS Code 中开发项目
- 安装 VS Code：如果未安装，可从VS Code 官网下载安装。
- 安装插件：打开 VS Code，点击左侧的扩展图标，搜索并安装 “Flutter” 和 “Dart” 插件。
- 导入项目：点击 “文件” - “打开文件夹”，选择刚才创建的 Flutter 项目目录。
- 运行项目：在 VS Code 中，点击左下角的绿色运行按钮，选择要运行的设备（如模拟器或 Mac 桌面应用）。如果想在模拟器运行，确保模拟器已启动；若要在浏览器运行，可执行 “flutter run -d chrome” 命令 。运行过程中，项目会进行编译，编译时间取决于 Mac 电脑的配置。
（五）热加载和热重启
在开发过程中，热加载和热重启能提高开发效率。修改代码保存后，在终端中输入 “r” 进行热加载，可实时看到代码修改效果；输入 “R”（即 “shift + r”）进行热重启。输入 “o” 可调整运行模式（如切换安卓或 iOS 模式）。
（六）在不同平台运行项目
- 在 Mac 桌面运行：在终端中执行 “flutter run -d macos” 命令，项目会在 Mac 桌面生成一个应用窗口。
- 在 Web 浏览器运行：执行 “flutter run -d chrome” 命令，项目会在 Chrome 浏览器中运行。若默认显示效果不佳，可右键点击页面选择 “检查”，在开发者工具中切换设备模式查看效果。
通过以上详细步骤，你就可以在 Mac 电脑上成功搭建 Flutter iOS 开发环境，并创建和运行项目。无论是开发 iOS 应用、Mac 桌面软件还是 Web 应用，Flutter 都能为你提供高效、便捷的开发体验。希望这篇文章能帮助你顺利开启 Flutter 开发之旅！
