
系统要求
目前Flutter只能在Mac和Linux(64位)上工作,使用windows的同学可能要借助虚拟机来进行学习。
安装Flutter SDK
这一步其实很简单,就是将Flutter在github上的源码整个clone下来,在适当的目录执行👇命令:
$ git clone https://github.com/flutter/flutter.git
$ export PATH=`pwd`/flutter/bin:$PATH
接着运行:
$ flutter doctor
👆这个命令会告诉你你的flutter还缺少什么依赖,输出如下:

接着运行:
$ flutter
第一次运行flutter
它会自动下载一些依赖,并且进行自动编译。随后再次运行flutter就会跳过这些步骤。
Google Analytics的配置
安装完flutter以后google analytics默认是自动打开的,如果有同学不喜欢flutter在后台默默上传你的使用数据和错误信息可以选择关闭:
$ flutter config --no-analytics
Android 环境搭建
Android环境搭建相对简单,这里就不赘述了,做过Android开发的小伙伴应该都有现成的环境。大体步骤是:
- 安装Android Studio
- 下载Android Sdk
Android设备
这里使用真机和模拟器都OK,但要注意Android版本要大于等于4.1。
Flutter IntelliJ 插件安装
Flutter提供了IntelliJ的插件,安装方法如下:
首先是安装IntelliJ,官方下载地址。
接着需要安装Dart和Flutter两个插件,其中dart用于代码的分析,flutter用于工程的编译等工作:

进入Preference中的Plugins设置模块,点击Browse repositories,查找dart和flutter并安装。


接着在Preferences中的Languages & Frameworks中对dart和flutter进行sdk路径配置。sdk路径参考你的机器。


第一个Flutter App
到这里,Flutter的开发环境基本配置完成,下面我们跑一个小例子。


选择Flutter接着next,

来一个喜闻乐见的hello_flutter,点击Finish。

如果你连接着Android设备的话,右上角就会有此设备的选项,

点击绿色的三角形,我们第一个Flutter app就成功在手机上跑起来了。

用命令行编译hello_flutter
上述flutter的插件给我们提供了方便的编译手段,但如果要编译release怎么办呢?这里就用到了flutter命令。
进入hello_flutter目录下,我们查看一下flutter有哪些命令:

其中正好有我们想要的run命令,接着查看run命令的帮助:

看到这里的release吧,接着使用flutter run --release
就能编译出release版本了,release版本的app比debug的app在性能和稳定性上都有所提升。
总结
这篇文章主要和大家学习了一下Flutter的环境搭建和在intelliJ下的使用。在最后还学习了下如何用命令行来编译flutter app。在上一节中的那个官方demo大家不妨自己试着编译一下。其工程路径是flutter/examples/flutter_gallery
。
网友评论
Unknown operating system. Cannot install Dart SDK.
怎么回事啊大神
不能run整个工程