Mac搭建Flutter IOS环境详细指南

目录

[1. 准备工作](#1. 准备工作)

[2. 下载Flutter SDK:](#2. 下载Flutter SDK:)

[2.1 配置环境](#2.1 配置环境)

[2.2 解决环境报错 zsh:command not found:flutter](#2.2 解决环境报错 zsh:command not found:flutter)

[2.3、再使用source命令重新加载一下:【source ~/.zshrc】,下次再编辑这个文件就可以直接执行:【open ~/.zshrc】](#2.3、再使用source命令重新加载一下:【source ~/.zshrc】,下次再编辑这个文件就可以直接执行:【open ~/.zshrc】)

[2.4、执行【flutter doctor】测试效果](#2.4、执行【flutter doctor】测试效果)

[3. 安装Xcode IOS环境](#3. 安装Xcode IOS环境)

[3.1 需要安装brew,通过brew安装CocoaPods.](#3.1 需要安装brew,通过brew安装CocoaPods.)

[3.2 复制命令行,打开终端](#3.2 复制命令行,打开终端)

[3.3 分别执行下面命令](#3.3 分别执行下面命令)

[3.4 如图所示](#3.4 如图所示)

[4.Mac 创建Flutter IOS项目](#4.Mac 创建Flutter IOS项目)

[4.1 通过 sudo chmod -R 777 * 修改一下文件权限](#4.1 通过 sudo chmod -R 777 * 修改一下文件权限)

[4.2 Xcode 打开Flutter项目](#4.2 Xcode 打开Flutter项目)


1. 准备工作

  1. 升级Macos系统为最新系统

  2. 安装最新的Xcode

  3. 电脑上面需要安装brew https://brew.sh/

4、安装chrome浏览器(开发web用)

2. 下载Flutter SDK:

flutter官网地址: Flutter - Build apps for any screen

也可以查看这篇博客: flutter下载SDK环境配置步骤详解_flutter sdk下载-CSDN博客

2.1 配置环境

1、打开命令行,执行【open ~/.bash_profile 】

2、将下面内容粘贴到.bash_profile文件

复制代码
export PATH="$PATH:/home/yourusername/flutter/bin"
export PUB_HOSTED_URL=https://pub.flutter-io.cn
export FLUTTER_STORAGE_BASE_URL=https://storage.flutter-io.cn

3、执行【source ~/.bash_profile 】,将.bash_profile文件生效

4、执行【flutter doctor】测试效果。

注意哈:

这样配置,如果你只有(bash_profile,没有zshrc文件)。
需要每次打开终端输入一下 source ~/.bash_profile 命令,再使用flutter命令。不然会报错。
zsh:command not found:flutter

像下面图片效果:

2.2 解决环境报错 zsh:command not found:flutter

1、执行:【open ~/.zshrc 】

2、如果 提示文件不存在,则执行:【vim ~/.zshrc 】新建一个新文件。

复制代码
 vim ~/.zshrc

2.3、再使用source命令重新加载一下:【source ~/.zshrc】,下次再编辑这个文件就可以直接执行:【open ~/.zshrc】

复制代码
source ~/.zshrc

2.4、执行【flutter doctor】测试效果

这个时候试试关闭终端再输入flutter doctor,此时问题解决。

3. 安装Xcode IOS环境

3.1 需要安装brew,通过brew安装CocoaPods.

Homebrew官网: https://brew.sh

3.2 复制命令行,打开终端

3.3 分别执行下面命令

复制代码
brew insta11 cocoapods.

pod setup

sudo xcode-select --switch /Applications/xcode.app/contents/Developer

sudo xcodebuild -runFirstLaunch

3.4 如图所示

复制代码
brew doctor

4.Mac 创建Flutter IOS项目

复制代码
sudo flutter create flutterdemo 

sudo chmod -R 777 flutterdemo //修改一下文件权限 可读。可写

4.1 通过 sudo chmod -R 777 * 修改一下文件权限

4.2 Xcode 打开Flutter项目

复制代码
flutter run
flutter -d all
flutter -d chrome
相关推荐
用户12039112947261 分钟前
使用 Tailwind CSS 构建现代登录页面:从 Vite 配置到 React 交互细节
前端·javascript·react.js
杨进军1 分钟前
模拟 Taro 实现编译多端样式文件
前端·taro
tiantian_cool2 分钟前
Claude Code 四大核心技能使用指南
ios
阿珊和她的猫24 分钟前
React Hooks:革新组件开发的优势与实践
前端·react.js·状态模式
全栈技术负责人25 分钟前
AI时代前端工程师的转型之路
前端·人工智能
花归去43 分钟前
echarts 柱状图曲线图
开发语言·前端·javascript
喝拿铁写前端43 分钟前
当 AI 会写代码之后,我们应该怎么“管”它?
前端·人工智能
老前端的功夫1 小时前
TypeScript 类型魔术:模板字面量类型的深层解密与工程实践
前端·javascript·ubuntu·架构·typescript·前端框架
Nan_Shu_6141 小时前
学习: Threejs (2)
前端·javascript·学习
G_G#1 小时前
纯前端js插件实现同一浏览器控制只允许打开一个标签,处理session变更问题
前端·javascript·浏览器标签页通信·只允许一个标签页