首页 > 技术文章 > Flutter-Mac环境配置、xcode打开Flutter项目

wangkejia 2022-03-04 11:02 原文

环境配置

Flutter SDK 安装

下载完成后解压将其SDK flutter文件夹放入系统根目录,例如:

/Users/k/flutter_sdk/flutter

终端环境配置

终端输入:

open ~/.bash_profile

写入以下内容后按esc键 :wq保存退出(注意SDK目录):

export PATH=/Users/k/flutter_sdk/flutter/bin:$PATH 
export PUB_HOSTED_URL=https://pub.flutter-io.cn
export FLUTTER_STORAGE_BASE_URL=https://storage.flutter-io.cn

然后执行:

source ~/.bash_profile

检查坏境

flutter doctor

注意:需提前安装好xcode、brew、cocoapod、vscode

命令创建Flutter项目

终端 cd 到创建项目的文件夹中,执行:

sudo flutter create flutterapp01

注意:flutterapp01 为项目名,这里建议字母都小写

修改SDK和项目目录权限

SDK权限(读写)

终端 cd 到SDK所在文件夹(例:/Users/k/flutter_sdk/flutter),执行:

sudo chmod -R 777 flutter_sdk

项目权限(读写)

终端 cd 到 项目文件夹(先cd到flutterapp01文件夹,再执行 cd ../),执行:

sudo chmod -R 777 flutterapp01(App名称)

xcode打开项目

在项目文件夹(flutterapp01)中找到 ios文件夹,双击 Runner.xcodeproj 文件即可编译运行

配置 vscode

安装Dart、Flutter、flutter Widget Snippets、Code Runnner等

vscode终端打开项目

vscode 选中调试模拟器,vscode终端执行:

flutter run

注意,如执行 flutter run 后出现:zsh: command not found: flutter,

方法一、打开Mac 终端执行:

vim ~/.zprofile

然后退出保存,重启vscode即可。

方法二、终端执行:

open ~/.zshrc

如不存在文件执行:

vim ~/.zshrc

继续执行:

open ~/.bash_profile

将 bash_profile 中的内容copy到 zshrc 文件中,保存zshrc文件 :wq 回车

 

推荐阅读