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
相关推荐
hh.h.16 小时前
开源鸿蒙生态下Flutter的发展前景分析
flutter·开源·harmonyos
前端一小卒16 小时前
一个看似“送分”的需求为何翻车?——前端状态机实战指南
前端·javascript·面试
syt_101316 小时前
Object.defineProperty和Proxy实现拦截的区别
开发语言·前端·javascript
遝靑16 小时前
Flutter 跨端开发进阶:可复用自定义组件封装与多端适配实战(移动端 + Web + 桌面端)
前端·flutter
cypking16 小时前
Web前端移动端开发常见问题及解决方案(完整版)
前端
老前端的功夫16 小时前
Vue 3 vs Vue 2 深度解析:从架构革新到开发体验全面升级
前端·vue.js·架构
栀秋66617 小时前
深入浅出链表操作:从Dummy节点到快慢指针的实战精要
前端·javascript·算法
狗哥哥17 小时前
Vue 3 动态菜单渲染优化实战:从白屏到“零延迟”体验
前端·vue.js
青青很轻_17 小时前
Vue自定义拖拽指令架构解析:从零到一实现元素自由拖拽
前端·javascript·vue.js
树下水月17 小时前
纯HTML 调用摄像头 获取拍照后的图片的base64
前端·javascript·html