Flutter beta3 避坑指南1

尝试写Flutter也有几周了, 期间遇到了不少坑, 有的是Flutter尚未完善的需要官方来填, 有的则需要自己来解决, 下面跟大家分享一下自己遇到的几个问题和相应的解决办法.

1. 编辑器强烈建议使用Android Studio

VS Code是我个人非常喜爱的代码编辑器. 美观、简洁、快速. 但是至少目前, 我还是建议你使用谷歌亲儿子Android Studio来开发Flutter. VS Code的Flutter插件已经相当强大, 但Android Studio上的Flutter插件显然更加强大, 功能也更为丰富. 最重要的是, 目前的Flutter还不够稳定(尤其是热加载).

热加载失败 相信你一定很眼熟

当使用VS Code热加载失效时, 你只能重新编译运行, 这其中还包括pod更新和Xcode重新编译, 过程相当缓慢. 但使用Android Studio, 你可以通过点击绿色的箭头进行“冷加载”.没有Xcode编译过程, app甚至都没有重启, 你的项目又恢复了正常!

Android Studio

需要注意的是, 如果你安装并引用了新的第三方库, 还是需要乖乖重新编译应用.这个时候不重启应用虽然能够跑起来, 但会出现各种问题.

2. 永久更新PATH变量

这件事情应该很早就要做了, 尤其是国内网络不好的缘故, 更需要第一时间使用镜像网站. 官网对于.bash_profile的介绍不是很详细, 我就以Mac为例详细讲解一下.

cd ~                       //进入当前用户目录
touch .bash_profile        //新建.bash_profile文件(如果不存在的话)
open -e .bash_profile      //用记事本打开.bash_profile文件
source .bash_profile       //更新刚配置的环境变量

首先进入用户主目录, 新建.bash_profile文件, 打开, 添加三句话

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

前两句是替换镜像网站,第三句是添加PATH变量, PATH_TO_FLUTTER_GIT_DIRECTORY要改为Flutter在本地的路径, 比如我自己的:
/Users/jihongbo/development/flutter/bin:$PATH
教大家一个好方法, 在目录上右击弹出菜单, 此时按住option健, 会出现“将XXX拷贝为路径名称”, 这时就可以直接粘贴用了.
注意: 后面不要加任何符号, 比如//注释等等. =前后没有空格(被坑好久)
最后更新一下配置就OK了. 编辑器也要重启一下一并更新终端配置.

3. 资源管理 pubspec.yaml

pubspec.yaml很像iOS的podfile或者Node.js的package.json, 是专门用来管理第三方库的. 但同时他也担负着管理资源(图片、字体)的任务.
看过教程的我们都知道添加图片字体只需要在文件中加入类似下面的代码.

fonts:
- family: flyou
  fonts:
    - asset: fonts/fa-solid-900.ttf

但请注意, 他们的缩进关系一定要正确, 否则会编译失败. 猜测pubspec.yaml是根据名称以及缩进关系来组织字体信息的, 但这种方式远不如JSON来的直观.

4. 对iOS开发不够友好

最容易上手Flutter的要数Android开发了, 原因很简单, 都是一个爸爸生的. 从默认的Material Design风格, 到连名字都一毛一样的控件, 连看API的功夫都省了, 闭着眼睛都能猜到想要的控件名称. 其次就是前端开发, 因为Flutter的核心与React以及Vue非常相似, 理解起来得心应手, Dart与ES6又有着极为相似的语法. 而对于iOS开发而言, 需要去啃API文档, 需要去理解数据单向传递的概念, 需要去理解swift还没有发布的异步特性...
但是反过来说, 上面提到的这些新的特性都是目前最新最热的技术, 即便现在不学习, 往后肯定也会需要用到. iOS开发环境相对前端甚至安卓来说都太安逸了, 产生技术爆炸点的频率相当低. 但我们不能因此拘泥于现有的技术而停滞不前.
所以一起加油吧!