Flutter 环境搭建

一直想尝试Flutter,但看群里有人说Flutter开发环境搭建有点麻烦,尝试一下果真如此,所以在此记录一下。由于我使用mac,所以这篇仅针对在macOS上搭建Flutter开发环境。

一、 系统要求

  • 操作系统:macOS (64-bit)
  • 磁盘空间: 700 MB (不包括Xcode或Android Studio的磁盘空间)

二、获取SDK

获取SDK有两种方式:

这步完成后,解压安装包到你想安装的目录。两种方式,一种是直接解压,即鼠标右键,第二种是使用unzip

三、配置Flutter环境

1、在命令行下,进入用户目录

cd $HOME

2 、打开.bash_profile文件

open -e .bash_profile

3、添加 Flutter SDK 安装的路径
bash_profile文件中,添加SDK安装路径,并将Flutter官方为中国开发者搭建了临时镜像添加进去

export PATH=${PATH}:`pwd`/flutter/bin:$PATH
export PUB_HOSTED_URL=https://pub.flutter-io.cn
export FLUTTER_STORAGE_BASE_URL=https://storage.flutter-io.cn

其中,pwd是SDK的安装路径,比如在我的mac中,我就要这么填写

export PATH=${PATH}:/Users/darrenW/Flutter/flutter/bin:$PATH

/Users/darrenW/Flutter是SDK的安装路径。
后面两行是临时镜像,不能保证一直可用,读者可以参考详情请参考 Using Flutter in China 以获得有关镜像服务器的最新动态。

4、更新刚配置的环境变量

source .bash_profile

5、运行 flutter doctor
命令行输入flutter doctor,安装 Futter 剩余依赖项。

四、编辑器设置

由于我是iOS开发,电脑上已经有Xcode,所以不再介绍xcode的安装,至于安装Android Studio,也不在介绍,敬请百度。
编辑器我使用的是Visual Studio Code(VSCode大法好呀!),版本要求1.20.1或更高版本。
1、安装Flutter插件

  • 启动 VS Code
  • 在应用商店中搜索flutter,下载安装
  • 重启VS Code

2、 通过Flutter Doctor验证设置

  • 调用 View>Command Palette...(快捷键shit+com+p)
  • 输入 ‘doctor’, 然后选择 ‘Flutter: Run Flutter Doctor’ action
  • 查看“OUTPUT”窗口中的输出是否有问题

3、创建新的应用

  • 调用 View>Command Palette…
  • 输入 ‘flutter’, 然后选择 ‘Flutter: New Project’ action
  • 输入 Project 名称 (如myapp), 然后按回车键
  • 指定放置项目的位置,然后按蓝色的确定按钮
  • 等待项目创建继续,并显示main.dart文件(在lib文件夹中)
  • 运行应用程序(如果你之前没有打开Simulator,请打开,不然无法运行)

至此,Flutter环境就算搭建成功了。

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

推荐阅读更多精彩内容

  • 谨以此文献给想少走弯路的人,笔者参考传送门走了不少弯路 1 配置环境变量 由于在国内访问Flutter有时可能会受...
    lltree阅读 1,004评论 1 0
  • Flutter,谷歌开源的一个混合开发框架,最近很火啊。 Flutter环境对Mac系统要求: 操作系统: mac...
    Sheldon_WDG阅读 1,364评论 12 2
  • Flutter是一种跨端语言,支持同时开发iOS和Android,考虑到iOS所需的环境和Xcode,建议Flut...
    MMR无与伦比阅读 1,648评论 0 0
  • 从上月7号到21号截止,从经历科二到科三,恍恍惚惚,一路杀下来科三在最后靠边停车时,压线导致不过关。时隔二...
    SHE林阅读 273评论 0 0
  • 基本概念 Ajax 全称是异步的 JavaScript 和 XML 。 通过在后台与服务器进行少量数据交换,AJA...
    faremax阅读 304评论 0 0