Flutter Mac环境配置

tiantian_cool
147 阅读3分钟

打开终端，运行以下命令安装 Homebrew（如果尚未安装）,如果报错终端科学上网重新执行

/bin/bash -c "$(curl -fsSL https://raw.githubusercontent.com/Homebrew/install/HEAD/install.sh)"

安装完后如果报报错PATH路径问题

apple@iMac ~ % echo >> ~/.zprofile
apple@iMac ~ % echo 'eval "$(/opt/homebrew/bin/brew shellenv)"' >> ~/.zprofile
apple@iMac ~ % eval "$(/opt/homebrew/bin/brew shellenv)"
apple@iMac ~ % echo $PATH
/opt/homebrew/bin:/opt/homebrew/sbin:/usr/local/bin:/System/Cryptexes/App/usr/bin:/usr/bin:/bin:/usr/sbin:/sbin:/var/run/com.apple.security.cryptexd/codex.system/bootstrap/usr/local/bin:/var/run/com.apple.security.cryptexd/codex.system/bootstrap/usr/bin:/var/run/com.apple.security.cryptexd/codex.system/bootstrap/usr/appleinternal/bin
apple@iMac ~ %

现在 Homebrew 已可用，重新安装 Git：

brew install git

 手动安装 Flutter SDK（适用于 Mac M1/M2）

  1. 访问 Flutter 官网下载页面：

👉 flutter.dev/docs/get-st…

  • 选择 “macOS (Apple Silicon)” 版本（flutter_macos_arm64_<版本>.zip）。
  • 点击下载（建议用浏览器直接下载，不要用迅雷等工具）
  1. 解压 Flutter SDK

配置 Flutter 环境变量

打开终端，运行：

nano ~/.zshrc

在文件末尾添加：

export PATH="$PATH:$HOME/flutter/bin"

保存并退出：

  • 按 Ctrl + X → 输入 Y（确认保存）→ 回车。

使配置生效：

source ~/.zshrc

验证 Flutter 是否可用

flutter --version

如果输出类似：

Flutter 3.19.0 • channel stable • ...

说明安装成功！🎉

在 VS Code 中配置 Flutter SDK 路径

  1. 打开 VS Code，按 Cmd + ,（Mac）打开 设置（Settings）。

  2. 搜索 Flutter SDK Path。

  3. 点击 “Locate SDK”，然后选择你解压的 Flutter 文件夹（如 /Users/你的用户名/flutter）或者直接在 settings.json 里添加：

    "dart.flutterSdkPath": "/Users/你的用户名/flutter"

运行flutter doctor检查依赖

flutter doctor

提示如下 ：

Doctor summary (to see all details, run flutter doctor -v):
[✓] Flutter (Channel stable, 3.29.3, on macOS 15.3.1 24D70 darwin-arm64, locale zh-Hans-CN)
[✗] Android toolchain - develop for Android devices
    ✗ Unable to locate Android SDK.
      Install Android Studio from: https://developer.android.com/studio/index.html
      On first launch it will assist you in installing the Android SDK components.
      (or visit https://flutter.dev/to/macos-android-setup for detailed instructions).
      If the Android SDK has been installed to a custom location, please use
      `flutter config --android-sdk` to update to that location.

[✗] Xcode - develop for iOS and macOS
    ✗ Xcode installation is incomplete; a full installation is necessary for iOS and macOS development.
      Download at: https://developer.apple.com/xcode/
      Or install Xcode via the App Store.
      Once installed, run:
        sudo xcode-select --switch /Applications/Xcode.app/Contents/Developer
        sudo xcodebuild -runFirstLaunch
    ✗ CocoaPods not installed.
        CocoaPods is a package manager for iOS or macOS platform code.
        Without CocoaPods, plugins will not work on iOS or macOS.
        For more info, see https://flutter.dev/to/platform-plugins
      For installation instructions, see https://guides.cocoapods.org/using/getting-started.html#installation
[✓] Chrome - develop for the web
[!] Android Studio (not installed)
[✓] VS Code (version 1.99.3)
[✓] Connected device (2 available)
[!] Network resources                            
    ✗ A network error occurred while checking "https://pub.dev/": Operation timed out
    ✗ A network error occurred while checking "https://maven.google.com/": Operation timed out

! Doctor found issues in 4 categories.

下一步：创建并运行第一个 Flutter 应用

方法 1：通过 VS Code（推荐）

  1. 打开 VS Code，按 Cmd+Shift+P 输入 Flutter: New Project。
  2. 选择 Application，输入项目名称（如 my_app）。
  3. 等待项目创建完成，VS Code 会自动打开项目。

方法 2：通过终端

flutter create my_app
cd my_app
code .  # 用 VS Code 打开项目

🚀 运行项目

  1. 确保模拟器或真机已连接：
    • Android：启动 Android Studio 的 AVD Manager 运行模拟器。
    • iOS：运行 open -a Simulator 启动 iOS 模拟器。
  2. 在 VS Code 中运行：
    • 点击左下角的设备选择器（如 No Device），选择你的设备。
    • 按 F5 或点击右上角的 ▶️ Run 按钮。

🔧 解决方案：让 iOS 模拟器出现在 VS Code 运行选项中

1. 确保 iOS 模拟器已正确启动

  • 在终端运行以下命令手动启动 iOS 模拟器

  • 检查模拟器是否正常运行（选择设备，如 iPhone 15 Pro）。

    open -a Simulator

2. 检查 Flutter 是否识别 iOS 设备

flutter devices

✅ 正常输出示例：

2 connected devices:
iPhone 15 Pro (mobile) • XXXXXXXXXXXXXX • ios • iOS 17.4
macOS (desktop)       • macos          • darwin-arm64 • macOS 15.3.1
Chrome (web)          • chrome         • web-javascript • Google Chrome 123.0.6312.87

如果 没有 iOS 设备，说明 Flutter 未检测到模拟器，继续下一步。

确保 Xcode 命令行工具已配置

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

这会安装 iOS 开发所需的组件

4. 重启 VS Code 并重新加载设备列表

  1. 关闭 VS Code。

  2. 在终端运行：

    killall Simulator # 关闭模拟器 open -a Simulator # 重新启动

重新打开 VS Code，进入你的 Flutter 项目。按F5，现在应该能看到 iOS 模拟器选项

avatar
文章
阅读
粉丝