Flutter之MacOS系统安装环境

MacOS系统安装环境

一、下载镜像

由于国内被墙,需要设置下载镜像,终端输入:

export PUB_HOSTED_URL=https://pub.flutter-io.cn
    
export FLUTTER_STORAGE_BASE_URL=https://storage.flutter-io.cn

二、下载flutter包

终端输入:

git clone -b dev https://github.com/flutter/flutter.git

三、设置flutter为全局可执行

只需要终端输入:

export PATH="$PWD/flutter/bin:$PATH"    
  • 以上配置命令为当前终端窗口临时设置PATH变量,你会发现系统重新启动后配置的PATH变量丢失。

  • 在终端执行flutter doctor 提示command not found 。

所以我们要将Flutter PATH环境变量永久添加到系统路径中,以便可以运行flutter命令在任何终端会话中。步骤如下:

  1. 确定您Flutter SDK的目录,您将在步骤3中用到

  2. 打开(或创建) $HOME/.bash_profile. 文件路径和文件名可能在您的机器上不同.(如不太了解.bash_profile的相关操作可以参考 Mac 打开、编辑.bash_profile)

  3. 添加以下行并更改[PATH_TO_FLUTTER_GIT_DIRECTORY]为克隆Flutter的git repo的路径

打开.bashprofile文件,并把下面flutter环境配置添加到:

//Flutter sdk 环境变量配置
export PUB_HOSTED_URL=https://pub.flutter-io.cn

export FLUTTER_STORAGE_BASE_URL=https://storage.flutter-io.cn

// /Users/geek是你fultter sdk的路径
export PATH=/Users/ypf/flutter/bin:$PATH

注意:PATH_TO_FLUTTER_GIT_DIRECTORY 为你flutter的路径,比如“/Users/ypf”

 export PATH=~/Users/ypf/flutter/bin:$PATH

保存好关闭bashprofile文件。

然后运行:

source $HOME/.bash_profile

刷新当前终端窗口。
然后通过运行flutter/bin命令验证目录是否在已经在PATH中:

echo $PATH

这时候就不用每次打开终端都要临时设置PATH变量,很烦人。这时候:

flutter doctor

如果还是提示command not found,那就是没有配成功,查看一下步骤,有没有错误的。

如果在终端运行

flutter doctor 

提示如下:

Waiting for another flutter command to release the startup lock

解决方法

1、打开flutter的安装目录/bin/cache/(可以通过指令进去)
2、手动删除lockfile文件,也可以指令删除(rm -rf lockfile)
3、重新在终端运行 flutter doctor查看一下,是否检查环境安装

四、检查环境安装

检查依赖环境是否正常,完成安装。
终端输入:

cd ./flutter
flutter doctor

这个命令会检查环境并在窗口显示报告,Dart SDK与Flutter捆绑在一起;没有必要单独安装Dart。仔细检查输出是否需要安装其他软件或执行其他任务

注意点:

  • 第一次运行命令时,它会下载自身的依赖关系并自行编译,后续运行会快很多。
  • 如果过程失败,多重复几次,并根据命令行提示进行安装。
Last login: Sun Apr 28 14:44:44 on ttys000
localhost:~ ypf$ export PUB_HOSTED_URL=https://pub.flutter-io.cn
localhost:~ ypf$ export FLUTTER_STORAGE_BASE_URL=https://storage.flutter-io.cn
localhost:~ ypf$ git clone -b master https://github.com/flutter/flutter.git
fatal: destination path 'flutter' already exists and is not an empty directory.
localhost:~ ypf$ export PATH="$PWD/flutter/bin:$PATH"
localhost:~ ypf$ cd ./flutter
localhost:flutter ypf$ flutter doctor
Building flutter tool...
Flutter assets will be downloaded from https://storage.flutter-io.cn. Make sure
you trust this source!
Downloading Material fonts...                                       5.2s
Downloading android-arm-profile/darwin-x64 tools...                 6.1s
Downloading android-arm-release/darwin-x64 tools...                 5.2s
Downloading android-arm64-profile/darwin-x64 tools...               6.5s
Downloading android-arm64-release/darwin-x64 tools...               5.4s
Downloading android-x86 tools...                                   40.4s
Downloading android-x64 tools...                                   41.9s
Download failed -- attempting retry 1 in 1 second...                    
Downloading android-arm tools...                                   20.3s
Downloading android-arm-profile tools...                           11.6s
Download failed -- attempting retry 1 in 1 second...                    
Downloading android-arm-release tools...                           11.0s
Downloading android-arm64 tools...                                 21.4s
Download failed -- attempting retry 1 in 1 second...                    
Downloading android-arm64-profile tools...                         15.1s
Downloading android-arm64-release tools...                         10.2s
Downloading ios tools...                                           97.3s
Downloading ios-profile tools...                                   69.6s
Downloading ios-release tools...                                   57.3s
Downloading Gradle Wrapper...                                       0.2s
Download failed -- attempting retry 1 in 1 second...                    
Downloading package sky_engine...                                   3.4s
Downloading common tools...                                        24.6s
Downloading common tools...                                        25.0s
Downloading darwin-x64 tools...                                    82.0s
Doctor summary (to see all details, run flutter doctor -v):
[✓] Flutter (Channel master, v1.5.9-pre.43, on Mac OS X 10.13.6 17G65, locale
    zh-Hans-CN)
 
[!] Android toolchain - develop for Android devices (Android SDK version 27.0.3)
    ✗ Flutter requires Android SDK 28 and the Android BuildTools 28.0.3
      To update using sdkmanager, run:
        "/Users/ypf/Library/Android/sdk/tools/bin/sdkmanager"
        "platforms;android-28" "build-tools;28.0.3"
      or visit https://flutter.dev/setup/#android-setup for detailed
      instructions.
    ! Some Android licenses not accepted.  To resolve this, run: flutter doctor
      --android-licenses
[!] iOS toolchain - develop for iOS devices (Xcode 10.1)
    ✗ libimobiledevice and ideviceinstaller are not installed. To install with
      Brew, run:
        brew update
        brew install --HEAD usbmuxd
        brew link usbmuxd
        brew install --HEAD libimobiledevice
        brew install ideviceinstaller
    ✗ ios-deploy not installed. To install:
        brew install ios-deploy
[✓] Android Studio (version 3.1)
[✓] VS Code (version 1.33.0)
[✓] Connected device (1 available)

! Doctor found issues in 2 categories.
localhost:flutter ypf$ 

根据提示继续输入指令,完善自己flutter环境安装。根据上面的提示,iOS配置终端输入一下命令
,不是在flutter目录下,是重新打开终端的默认的路径下:

    brew update
    brew install --HEAD usbmuxd
    brew link usbmuxd
    brew install --HEAD libimobiledevice
    brew install ideviceinstaller
    
   // ios-deploy not installed. To install:
    brew install ios-deploy
    

然后在用flutter doctor查看一下。

//我们已经将Flutter PATH环境变量永久添加到系统路径中,不然每次重启终端都要调用设置临时path路径
export PATH="$PWD/flutter/bin:$PATH"    

cd ./flutter
flutter doctor

根据上面的提示,Some Android licenses not accepted.解决这个执行命令:

flutter doctor
  --android-licenses

然后根据提示信息输入 y 就行了。

还有一个就是android sdk的版本太低,更新sdk版本为最新就行:

android_config.png

点击Configure弹出下拉框选择SDK Manager。

android_config-1.png
android_config-2.png

把最新的sdk勾选上下载。下载完之后,打开终端,检查一下android环境配置是否成功

export PATH="$PWD/flutter/bin:$PATH"    
cd ./flutter
flutter doctor

如果出现这个

flutter_doctor_success.png

说明你的安装环境已经完成了。

Android Studio配置Flutter环境

  • 启动Android Studio.
  • 打开插件首选项 (Configure>Preferences>Plugins on macOS)
  • 选择 Browse repositories…, 选择 Flutter 插件并点击 install.
  • 重启Android Studio后插件生效.
配置Flutter.png

重启完Android Studio.会发现多了一个Start a new Flutter project选项

flutter_project.png

点击进入选择下一步,然后配置flutter sdk的路径如图:

配置flutter路径.png

点击next,一个在Android Studio工具创建的Flutter就算成功了。

使用xcode运行项目

在生成Flutter项目中有android和ios两个文件。

  • 双击进入ios文件
  • 在前提现在xcode的情况下双击Runner.xcworkspace文件就可以打开。(ios开发比较熟悉,可以忽略)

VSCode配置Flutter环境

  • 安装好VSCode并打开VSCode,操作如图:
VSCode教程1.png
  • 安装完之后,通过终端创建你的flutter项目。可以在想在位置创建你的fluuter项目

      flutter create 项目名
    
  • 创建完项目之后,通过VSCode打开项目,并运行项目指令:

      flutter run
    
VSCode教程2.png

运行完项目就可以看到模拟器上运行着项目:

VSCode教程3.png

结尾

到此Flutter环境的安装和配置基本告一段落。现在就可以正式开启你的Flutter 之旅。

最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
  • 序言:七十年代末,一起剥皮案震惊了整个滨河市,随后出现的几起案子,更是在滨河造成了极大的恐慌,老刑警刘岩,带你破解...
    沈念sama阅读 217,509评论 6 504
  • 序言:滨河连续发生了三起死亡事件,死亡现场离奇诡异,居然都是意外死亡,警方通过查阅死者的电脑和手机,发现死者居然都...
    沈念sama阅读 92,806评论 3 394
  • 文/潘晓璐 我一进店门,熙熙楼的掌柜王于贵愁眉苦脸地迎上来,“玉大人,你说我怎么就摊上这事。” “怎么了?”我有些...
    开封第一讲书人阅读 163,875评论 0 354
  • 文/不坏的土叔 我叫张陵,是天一观的道长。 经常有香客问我,道长,这世上最难降的妖魔是什么? 我笑而不...
    开封第一讲书人阅读 58,441评论 1 293
  • 正文 为了忘掉前任,我火速办了婚礼,结果婚礼上,老公的妹妹穿的比我还像新娘。我一直安慰自己,他们只是感情好,可当我...
    茶点故事阅读 67,488评论 6 392
  • 文/花漫 我一把揭开白布。 她就那样静静地躺着,像睡着了一般。 火红的嫁衣衬着肌肤如雪。 梳的纹丝不乱的头发上,一...
    开封第一讲书人阅读 51,365评论 1 302
  • 那天,我揣着相机与录音,去河边找鬼。 笑死,一个胖子当着我的面吹牛,可吹牛的内容都是我干的。 我是一名探鬼主播,决...
    沈念sama阅读 40,190评论 3 418
  • 文/苍兰香墨 我猛地睁开眼,长吁一口气:“原来是场噩梦啊……” “哼!你这毒妇竟也来了?” 一声冷哼从身侧响起,我...
    开封第一讲书人阅读 39,062评论 0 276
  • 序言:老挝万荣一对情侣失踪,失踪者是张志新(化名)和其女友刘颖,没想到半个月后,有当地人在树林里发现了一具尸体,经...
    沈念sama阅读 45,500评论 1 314
  • 正文 独居荒郊野岭守林人离奇死亡,尸身上长有42处带血的脓包…… 初始之章·张勋 以下内容为张勋视角 年9月15日...
    茶点故事阅读 37,706评论 3 335
  • 正文 我和宋清朗相恋三年,在试婚纱的时候发现自己被绿了。 大学时的朋友给我发了我未婚夫和他白月光在一起吃饭的照片。...
    茶点故事阅读 39,834评论 1 347
  • 序言:一个原本活蹦乱跳的男人离奇死亡,死状恐怖,灵堂内的尸体忽然破棺而出,到底是诈尸还是另有隐情,我是刑警宁泽,带...
    沈念sama阅读 35,559评论 5 345
  • 正文 年R本政府宣布,位于F岛的核电站,受9级特大地震影响,放射性物质发生泄漏。R本人自食恶果不足惜,却给世界环境...
    茶点故事阅读 41,167评论 3 328
  • 文/蒙蒙 一、第九天 我趴在偏房一处隐蔽的房顶上张望。 院中可真热闹,春花似锦、人声如沸。这庄子的主人今日做“春日...
    开封第一讲书人阅读 31,779评论 0 22
  • 文/苍兰香墨 我抬头看了看天上的太阳。三九已至,却和暖如春,着一层夹袄步出监牢的瞬间,已是汗流浃背。 一阵脚步声响...
    开封第一讲书人阅读 32,912评论 1 269
  • 我被黑心中介骗来泰国打工, 没想到刚下飞机就差点儿被人妖公主榨干…… 1. 我叫王不留,地道东北人。 一个月前我还...
    沈念sama阅读 47,958评论 2 370
  • 正文 我出身青楼,却偏偏与公主长得像,于是被迫代替她去往敌国和亲。 传闻我的和亲对象是个残疾皇子,可洞房花烛夜当晚...
    茶点故事阅读 44,779评论 2 354

推荐阅读更多精彩内容