Flutter环境配置 + VSCode/AndroidStudio + 基础知识了解

里程碑信息

2014.10 - 原名 sky 在github 上开源
2015.10 - 更名为 Flutter, 使用 Dart语言开发，Dart 是Google于2011年推出的新的计算机编程语言
2017.05 - Google I/O 正式发布Flutter
2018.02 - Flutter推出第一个 Beta版本(测试版本)
2018.6.21 - Google 发布 Flutter 的release预览版(最终测试版)
2019.02 - Flutter1.2发布增加对web的支持
2019.5.7 - 增加Flutter for Web，将Flutter的Dart代码直接编译为JavaScript, 就是用Dart 编译了一个可以再web端执行的程序。Flutter 正式成为一个全平台的框架。

Flutter支持的端

Mobile端已经较为成熟，体验较于React Native 要好一些，具体原因待探究。
Web 端演进中
Desktop(桌面端)：虽然不适用于生产环境，但是底层引擎已经基本成型，有待进一步整合。
Embedded(嵌入智能设备)

学习Flutter需要哪些必备知识？

Dart 语言基础
Flutter对熟悉面向对象概念(类、方法、变量)和命令式编程概念(循环、条件)经验者相对容易入门。

Flutter特点

快速开发
性能优越
富有表现力的精美UI
Everything is Widget

Flutter架构

Flutter原理

Flutter for Web架构

对比Flutter,引擎层变了

下载安装Flutter + 并执行demo

第一步 --- 下载页选择下载
第二步--- 更新环境变量

    终端窗口临时更新环境变量
    export PATH=`pwd`/flutter/bin:$PATH
    
    永久更新环境变量
    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
    
    
    1. 将  source ~/.bash_profile
       注入  ~/.zshrc 文件中
       
    2.将
        export PATH=PATH_TO_FLUTTER_GIT_DIRECTORY/flutter/bin:$PATH
        export PUB_HOSTED_URL=https://pub.flutter-io.cn
        export FLUTTER_STORAGE_BASE_URL=https://storage.flutter-io.cn
      注入  ~/.bash_profile 文件中
      (PATH_TO_FLUTTER_GIT_DIRECTORY 替换成 本机的 flutter文件路径)
      
    3.最后执行 flutter doctor

AndroidStudio

第三步 --- 下载AndroidStudio 并安装插件 Flutter Dart
第四步 --- 通过 Android Stadio 的 File => New => New Flutter Project 去新建项目demo
第五步 --- 下载SDK 并执行demo

VsCode

第三步 --- 安装插件 Flutter Dart
第四步 --- /cmd + /shirft + p => flutter new project
第五步 --- 打开调试工具并执行