devbox
IT小白
这个屌丝很懒，什么也没留下！
关注作者
热门标签
热门文章
当前位置:   article > 正文

Flutter学习系列（2）— 安装SDK_fluttersdk

作者：IT小白 | 2024-03-25 06:38:52

赞

踩

fluttersdk

更多文章请访问我的个人网站：https://www.ccarea.cn

本文原始地址： https://www.ccarea.cn/archives/515

 

 

目录

一 获取Flutter SDK

Stable channel (macOS)

关于四个Channel：

二 安装SDK和环境配置

三 SDK初探

flutter命令

Package目录

dev目录

bin目录

四 总结

 

 

这一篇主要介绍一下Flutter的SDK环境搭建，网上关于环境搭建的文章很多，但是介绍基本都没有介绍SDK里有些什么。本文以Mac上安装为例，因为主要涉及到SDK内部，所以和其他平台应该是一致的。

官方的安装文档： https://flutterchina.club/get-started/install/

 

 

一 获取Flutter SDK

 

官网下载页： https://flutter.dev/docs/development/tools/sdk/archive

GitHub下载页： https://github.com/flutter/flutter/releases

 

在国内Flutter官网可能无法访问，一般大家都会去github上下载。下面是github上的release包，最新版是v1.3.13

从GitHub下载有个问题是大家容易忽略的，就是版本的channel。如果能打开官网的网页，我们可以发现Flutter SDK 有Stable、Beat、Dev、Master 四个渠道。 其中Stable版本到目前为止只release了两个版本，通过对比发现，GitHub上release的是Dev版本。

 

Stable channel (macOS)

VersionRefRelease Date
v1.2.18661d8a2019/2/27
v1.0.053914472018/12/5

 

当然也可以直接通过git命令来下载SDK，下面命令下载的是mster分支。

  1.  git clone -b master https://github.com/flutter/flutter.git
  2.  ./flutter/bin/flutter --version

 

关于四个Channel

  • Master： 是最新的代码，官方解释是【latest cutting edge build】，不知道如何解释，但是基本上时可用的，只是不稳定。
  • Dev：官方解释是【latest fully-tested build】，经过完整的测试，功能可用的，但是可能会有一些问题。会有一个Bad Build来记录这些问题。会持续的从Master分支合并一些代码过来。
  • Beta：每个月会从Dev获取最好的build合并到Bate分支，Beta的分支是经过codeLab测试的
  • Stable：稳定版本，计划3个月左右发布一次。

 

学习话还是建议选取Stable版本。

 

 

 

二 安装SDK和环境配置

 

下载好SDK并解压之后，需要添加一下环境变量。 具体平台不同方式也不一样，Linux和Mac下，建议使用~/.profile文件， 在~/.bashrc或者~/.zshrc 中 加入 source ~/.profile

  1. #for flutter
  2. export FLUTTER_ROOT=/work/flutter
  3. export FLUTTER_HOME=$FLUTTER_ROOT/bin
  4. export PATH=$PATH:$FLUTTER_HOME:$FLUTTER_ROOT

按照官方提示，执行下面命令检查和安装flutter需要的依赖项目

flutter doctor

执行后会下载一些必要的依赖项目，主要是Dart SDK和一想相关的工具Flutter tool、Common tool、Android tool、IOS tool，Gradle。 然后会检查本机的开发软件是否安装好了。

如果执行这个命令很久没有相应，可能是在国内连接不上，所以可以使用官方提供的临时镜像， 如果自己有SS可以配合Proxifier进行全局代理，一般对java、dart、curl、git* 进行代理就可以了。

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

如果说是手动下载的zip包，执行这个命令时可能会提示你不是git目录的错误，这个时候只需要在SDK目录下执行一下git init 命令。不过还是建议直接使用git clone命令拉去SDK，然后切换到你要的版本。

  1. master
  2. * stable
  3.   remotes/origin/HEAD -> origin/master
  4.   remotes/origin/beta
  5.   remotes/origin/dev
  6.   remotes/origin/filiph-animated-widget-sample
  7.   remotes/origin/gallery
  8.   remotes/origin/master
  9.   remotes/origin/revert-28919-composite_elevations
  10.   remotes/origin/revert-29010-re_enable_dart2js
  11.   remotes/origin/revert-29323-roll_branch
  12.   remotes/origin/stable

更具体的环境安装过程就没必要写出来了，具体参考官网就可以了： https://flutterchina.club/setup-macos/

环境搭建好之后，就可以按照官方文档尝试新建并运行一个 Flutter程序了。 https://flutterchina.club/get-started/test-drive/

 

 

 

三 SDK初探

 

每次下载一个东西的SDK，我都喜欢看一看SDK里面有什么东西。Flutter SDK 提供了Framework的功能，所以我们先看一下SDK的目录结构，也能帮助我们理解flutter的架构。

  1. ➜  flutter git:(stable) ll
  2. total 96
  3. -rw-r--r--   1 chengchao  staff   1.4K  3 19 12:53 AUTHORS
  4. -rw-r--r--@  1 chengchao  staff   2.6K  3 13 01:23 CODE_OF_CONDUCT.md
  5. -rw-r--r--   1 chengchao  staff   3.4K  3 13 01:23 CONTRIBUTING.md
  6. -rw-r--r--   1 chengchao  staff   1.5K  3 13 01:23 LICENSE
  7. -rw-r--r--   1 chengchao  staff   1.1K  3 13 01:23 PATENTS
  8. -rw-r--r--   1 chengchao  staff   6.1K  3 19 12:53 README.md
  9. -rw-r--r--@  1 chengchao  staff   7.9K  3 13 01:23 analysis_options.yaml
  10. drwxr-xr-x   7 chengchao  staff   224B  3 19 12:53 bin
  11. -rw-r--r--   1 chengchao  staff   607B  3 13 01:23 dartdoc_options.yaml
  12. drwxr-xr-x  15 chengchao  staff   480B  3 16 01:09 dev
  13. drwxr-xr-x  12 chengchao  staff   384B  3 13 01:23 examples
  14. -rw-r--r--   1 chengchao  staff   1.7K  3 13 01:23 flutter_console.bat
  15. drwxr-xr-x  13 chengchao  staff   416B  3 19 12:53 packages
  16. -rw-r--r--   1 chengchao  staff     5B  3 23 00:07 version

其中有bin、dev、examples、package四个目录。我们先看看bin目录，一般这个都是最有用的。

  1. ➜  bin git:(stable) ls -l
  2. total 32
  3. drwxr-xr-x  16 chengchao  staff   512  3 23 00:07 cache
  4. -rwxr-xr-x@  1 chengchao  staff  6932  3 13 01:23 flutter
  5. -rw-r--r--   1 chengchao  staff  7288  3 19 12:53 flutter.bat
  6. drwxr-xr-x  11 chengchao  staff   352  3 23 00:26 internal

 

flutter命令

 

我们第一个执行的就是这个命令，用来下载依赖项目。其实只是一个sh脚本文件，执行一下会列举出命令参数 （篇幅原因只选取了重要的）。可以分为options 和 command两种。

  1. ➜  bin git:(stable) flutter
  2. Manage your Flutter app development.
  3.  
  4.  
  5.  
  6. Global options:
  7. -h, --help                  Print this usage information.
  8. -v, --verbose               Noisy logging, including all shell commands executed.
  9.                             If used with --help, shows hidden options.
  10.  
  11. -d, --device-id             Target device id or name (prefixes allowed).
  12.     --version               Reports the version of this tool.
  13.     --suppress-analytics    Suppress analytics reporting when this command runs.
  14.     --bug-report            Captures a bug report file to submit to the Flutter team.
  15.                             Contains local paths, device identifiers, and log snippets.
  16.  
  17.     --packages              Path to your ".packages" file.
  18.                             (required, since the current directory does not contain a ".packages" file)
  19.  
  20. Available commands:
  21.   analyze                  Analyze the project's Dart code.
  22.   build                    Flutter build commands.
  23.   channel                  List or switch flutter channels.
  24.   clean                    Delete the build/ and .dart_tool/ directories.
  25.   config                   Configure Flutter settings.
  26.   create                   Create a new Flutter project.
  27.   doctor                   Show information about the installed tooling.
  28.   help                     Display help information for flutter.
  29.   install                  Install a Flutter app on an attached device.
  30.   packages                 Commands for managing Flutter packages.
  31.   run                      Run your Flutter app on an attached device.
  32.   screenshot               Take a screenshot from a connected device.
  33.   upgrade                  Upgrade your copy of Flutter.
  34.   version                  List or switch flutter versions.
  35.  
  36. Run "flutter help <command>" for more information about a command.
  37. Run "flutter help -v" for verbose help output, including less commonly used options.

用vscode打开flutter脚本看看，发现只有不到180行代码，那么是如何拥有这么多功能？

  1. PROG_NAME="$(path_uri "$(follow_links "$BASH_SOURCE")")"
  2. BIN_DIR="$(cd "${PROG_NAME%/*}" ; pwd -P)"
  3. export FLUTTER_ROOT="$(cd "${BIN_DIR}/.." ; pwd -P)"
  4.  
  5. FLUTTER_TOOLS_DIR="$FLUTTER_ROOT/packages/flutter_tools"
  6. SNAPSHOT_PATH="$FLUTTER_ROOT/bin/cache/flutter_tools.snapshot"
  7. STAMP_PATH="$FLUTTER_ROOT/bin/cache/flutter_tools.stamp"
  8. SCRIPT_PATH="$FLUTTER_TOOLS_DIR/bin/flutter_tools.dart"
  9. DART_SDK_PATH="$FLUTTER_ROOT/bin/cache/dart-sdk"
  10.  
  11. DART="$DART_SDK_PATH/bin/dart"
  12. PUB="$DART_SDK_PATH/bin/pub"

从中截取一段代码，看看，原来flutter脚本只是一个壳子，具体都是调用了SDK里的功能。这些命令基本包含了SDK升级、Flutter程序创建、编译、打包、安装、调试、测试分析等各项功能。使用几个常用的非开发命令：

 

channel

可以查看和切换SDK的渠道

  1. ➜  bin git:(stable) flutter channel
  2. Flutter channels:
  3.   beta
  4.   dev
  5.   master
  6. * stable

 

version

可以查看和切换版本

  1. ➜  bin git:(stable) flutter version -h
  2. List or switch flutter versions.
  3.  
  4. Usage: flutter version [arguments]

这个命令容易和–version混淆

  1. ➜  bin git:(stable) flutter --version
  2. Flutter 1.2.1 • channel stable • https://github.com/flutter/flutter.git
  3. Framework • revision 8661d8aecd (5 weeks ago) • 2019-02-14 19:19:53 -0800
  4. Engine • revision 3757390fa4
  5. Tools • Dart 2.1.2 (build 2.1.2-dev.0.0 0a7dcf17eb)

这个会列举出Flutter版本。 如果还记得Flutter的架构图，这里列举出了Framework 和 Engine的版本号。 使用git log查看一下提交记录，最后一次提交的commit和上面Framework版本是一致的。上面使用的是revision 是 short commit，你可以直接用short commit切换到对应版本。

  1. commit 8661d8aecd626f7f57ccbcb735553edc05a2e713 (HEAD -> stable, tag: v1.2.1, origin/stable)
  2. Author: xster <xiao@xster.net>
  3. Date:   Thu Feb 14 19:19:53 2019 -0800
  4.  
  5.     Test text paint orders by color (#27983)
  6.  
  7. commit 22f888090970c0c99df87d57b8177685112e2c53
  8. Author: xster <xiao@xster.net>
  9. Date:   Thu Feb 14 16:50:06 2019 -0800
  10.  
  11.     Make sure the selection is still painted under the text (#27970)

 

 

Package目录

  1. ➜  packages git:(stable) ls -l
  2. total 8
  3. -rw-r--r--@  1 chengchao  staff  232  3 13 01:23 analysis_options.yaml
  4. drwxr-xr-x   8 chengchao  staff  256  3 19 12:53 flutter
  5. drwxr-xr-x   7 chengchao  staff  224  3 23 00:46 flutter_build
  6. drwxr-xr-x   8 chengchao  staff  256  3 19 12:53 flutter_driver
  7. drwxr-xr-x   7 chengchao  staff  224  3 23 00:44 flutter_goldens
  8. drwxr-xr-x   6 chengchao  staff  192  3 23 00:44 flutter_goldens_client
  9. drwxr-xr-x   7 chengchao  staff  224  3 23 00:44 flutter_localizations
  10. drwxr-xr-x   6 chengchao  staff  192  3 19 12:53 flutter_test
  11. drwxr-xr-x  19 chengchao  staff  608  3 19 12:53 flutter_tools
  12. drwxr-xr-x   7 chengchao  staff  224  3 19 12:53 fuchsia_remote_debug_protocol

结构很简单，看几个主要的目录

  • flutter：这个目录非常重要，提供了Flutter Framework的功能。比如widget.dart、rendering.dart等flutter的功能。
  • flutter_build：是和flutter程序编译相关
  • flutter_tools: 上面的那些命令的实现都在flutter_tools/lib/src/commands 目录下 。 这个下面提供了比如测试、IDE支持、Android/IOS 编译、调试等等工具

总的来说Package目录下都是提供给flutter开发的一些类工具类和Framework类，目前只是简单了解一下基本内容，有很多也不清楚具体用途，后面深入学习的话应该会接触到比较多内容。

 

dev目录

This directory contains tools and resources that the Flutter team uses during development of the framework. The tools in this directory should not be necessary for developing Flutter applications, though of course they may be interesting if you are curious.

 

bin目录

bin目录一般是一个SDK比较重要的目录，一般会包含重要的执行程序，比如Java SDK下就有javac，同样这里有前面看到的flutter脚本文件。相比刚解压或总git 下拉下来，多了一个cache目录。

  1. ➜  bin git:(stable) ll
  2. total 32
  3. drwxr-xr-x  16 chengchao  staff   512B  3 24 01:42 cache
  4. -rwxr-xr-x@  1 chengchao  staff   6.8K  3 13 01:23 flutter
  5. -rw-r--r--   1 chengchao  staff   7.1K  3 19 12:53 flutter.bat
  6. drwxr-xr-x  11 chengchao  staff   352B  3 23 00:26 internal

 

Cache目录

打开cache目录，发现里面有dart-sdk、flutter_tool、material_fonts。 这些都是前面下载的依赖项目。所以这个目录下的文件应该都是Flutter所需要的。

  1. total 49264
  2. drwxr-xr-x   6 chengchao  staff   192B  3 19 13:06 artifacts
  3. drwxr-xr-x  11 chengchao  staff   352B  3 19 14:12 dart-sdk
  4. drwxr-xr-x   2 chengchao  staff    64B  3 19 13:13 downloads
  5. -rw-r--r--   1 chengchao  staff    41B  3 19 12:57 engine-dart-sdk.stamp
  6. -rw-r--r--   1 chengchao  staff    40B  3 19 13:13 engine.stamp
  7. -rw-r--r--   1 chengchao  staff    24M  3 19 12:58 flutter_tools.snapshot
  8. -rw-r--r--   1 chengchao  staff    41B  3 19 12:58 flutter_tools.stamp
  9. -rw-r--r--   1 chengchao  staff   180B  3 23 00:03 flutter_version_check.stamp
  10. -rw-r--r--   1 chengchao  staff    88B  3 13 01:36 gradle_wrapper.stamp
  11. -rw-r--r--   1 chengchao  staff     0B  3 23 01:28 lockfile
  12. -rw-r--r--   1 chengchao  staff    78B  3 13 01:30 material_fonts.stamp
  13. drwxr-xr-x   3 chengchao  staff    96B  3 19 13:06 pkg

有5个*.stamp文件，其中flutter_version_check.stamp 内容如下，记录了服务器最新当前channel最新的版本时间和本地检查时间。

  1. {
  2.   "lastTimeVersionWasChecked": "2019-03-24 01:38:16.300412",
  3.   "lastKnownRemoteVersion": "2019-02-15 03:19:53.000Z"
  4. }

所以这些stamp文件是用来检查本地和服务器版本是否有差别的，其他几个记录的是revision（对应的就是源码git commit ID），所以Flutter SDK主要依赖下面4个 ：

 

 

dart-sdk目录

因为dart 可以支持命令行，Server、Web以及flutter使用，SDK直接可能会有一些差别。所以flutter默认使用自己下载的dart sdk。从flutter脚本中就可以看到，所以如果你机器上已经安装了dart sdk，可以在这里手动指定。 不过建议使用flutter自己下载的，因为他会使用对应版本的SDK。当然，正常来说用新版本也不会有比较大的差异。

  1. DART_SDK_PATH="$FLUTTER_ROOT/bin/cache/dart-sdk"
  2.  
  3. DART="$DART_SDK_PATH/bin/dart"
  4. PUB="$DART_SDK_PATH/bin/pub"

bin目录是dart的一些工具，这些工具其实也都是脚本文件，实际是调用snapshots目录下的dart程序。 这些dart程序都是以snapshot的形式发布的，  snapshot意思是快照，使用的目的是为了加快程序加载的速度。一般来说VM加载可执行文件时，要解析出相关class结构放在内存，而snapshot文件中是已经序列化之后的结构，可以直接反序列化到内存中。 这方面更具体类容后面学dart在研究。Snapshot意思可以参见：https://github.com/dart-lang/sdk/wiki/Snapshots

  1. ➜  bin git:(stable) tree
  2. .
  3. ├── dart
  4. ├── dartanalyzer
  5. ├── dartdoc
  6. ├── dartfmt
  7. ├── pub
  8. └── snapshots
  9.     ├── analysis_server.dart.snapshot
  10.     ├── dartanalyzer.dart.snapshot
  11.     ├── dartdoc.dart.snapshot
  12.     ├── dartfmt.dart.snapshot
  13.     ├── flutter_dart2js.dart.snapshot
  14.     ├── flutter_kernel_worker.dart.snapshot
  15.     ├── kernel-service.dart.snapshot
  16.     ├── pub.dart.snapshot
  17.     └── resources

lib目录下是dart提供的语言库，都是源码形式。

 

 

Flutter Engine

package目录下目前只有sky_engine, 里面README介绍

Flutter Engine

==============

This package describes the dart:ui library, which is the interface between Dart and the Flutter Engine. This package also contains a number of Flutter shell binaries that let you run code that uses the dart:ui library on various platforms.

主要作用是Framework和Engine之间的一个桥梁。

 

artifacts

这个目录下有Flutter依赖的Gradle和Material Font。

  1. total 0
  2. drwxr-xr-x  20 chengchao  staff  640  3 19 14:11 engine
  3. drwxr-xr-x   6 chengchao  staff  192  3 19 14:14 gradle_wrapper
  4. drwxr-xr-x  25 chengchao  staff  800  3 13 01:30 material_fonts

还有一个engine目录，看起来和Android以及IOS编译相关。

  1. ➜  engine git:(stable) ls -l
  2. total 0
  3. drwxr-xr-x  4 chengchao  staff  128  3 19 14:12 android-arm
  4. drwxr-xr-x  5 chengchao  staff  160  3 19 14:14 android-arm-dynamic-profile
  5. drwxr-xr-x  4 chengchao  staff  128  3 19 13:10 android-arm-dynamic-release
  6. drwxr-xr-x  4 chengchao  staff  128  3 19 13:09 android-arm-profile
  7. drwxr-xr-x  4 chengchao  staff  128  3 19 13:09 android-arm-release
  8. drwxr-xr-x  3 chengchao  staff   96  3 19 13:10 android-arm64
  9. drwxr-xr-x  4 chengchao  staff  128  3 19 13:10 android-arm64-dynamic-profile
  10. drwxr-xr-x  4 chengchao  staff  128  3 19 13:11 android-arm64-dynamic-release
  11. drwxr-xr-x  4 chengchao  staff  128  3 19 13:10 android-arm64-profile
  12. drwxr-xr-x  4 chengchao  staff  128  3 19 13:10 android-arm64-release
  13. drwxr-xr-x  4 chengchao  staff  128  3 19 13:09 android-x64
  14. drwxr-xr-x  4 chengchao  staff  128  3 19 13:09 android-x86
  15. drwxr-xr-x  4 chengchao  staff  128  3 19 14:12 common
  16. drwxr-xr-x  9 chengchao  staff  288  3 19 13:08 darwin-x64
  17. drwxr-xr-x  7 chengchao  staff  224  3 19 13:13 ios
  18. drwxr-xr-x  7 chengchao  staff  224  3 19 13:13 ios-profile
  19. drwxr-xr-x  7 chengchao  staff  224  3 19 13:13 ios-release

随便看2个目录

  1. ➜  engine git:(stable) ls -l android-arm
  2. total 10816
  3. -rw-r--r--@ 1 chengchao  staff  5536743  2 13 14:36 flutter.jar
  4. ➜  engine git:(stable) ls -l ios
  5. total 76144
  6. drwxr-xr-x  7 chengchao  staff       224  3 19 13:11 Flutter.framework
  7. -rw-r--r--  1 chengchao  staff  25786499  2 13 15:13 Flutter.framework.zip
  8. -rw-r--r--  1 chengchao  staff       758  2 13 14:02 Flutter.podspec
  9. -rw-r--r--  1 chengchao  staff      1520  3 13 01:23 LICENSE
  10. -rwxr-xr-x  1 chengchao  staff  13188856  2 13 15:13 gen_snapshot

打开个jar包看看，原来里面包含了Android开发需要的一些flutter的类。这个库相当于是Flutter和原生应用直接的一个沟通容器。通过使用这些类，可以在原生代码中嵌入和使用flutter程序。libFlutter.so应该就是flutter的Engine。

 

其中还有一个common目录，下面有一些和.dill文件（这些文件是drat源文件进行kernal编译后的文件。 简单说就是源码经过了语法分析变成了AST(抽象语法树)，主要是因为dart2.0后VM无法直接执行源码，代码必须经过kernel编译。关于Dart相关内容后面会学习到）。 这些dill应该也是会在编译flutter文件时使用到的。

  1. -rw-r--r--   1 chengchao  staff   1.4M  2 14 06:19 dart2js_outline.dill
  2. -rw-r--r--   1 chengchao  staff   7.0M  2 14 06:19 dart2js_platform.dill
  3. -rw-r--r--@  1 chengchao  staff   4.6K  2 14 06:09 libraries.json
  4. -rw-r--r--   1 chengchao  staff   5.9M  2 14 06:19 platform.dill
  5. -rw-r--r--   1 chengchao  staff    42K  2 14 06:19 platform.dill.d
  6. -rw-r--r--   1 chengchao  staff   5.9M  2 14 06:19 platform_strong.dill
  7. -rw-r--r--   1 chengchao  staff    42K  2 14 06:19 platform_strong.dill.d
  8. drwxr-xr-x  17 chengchao  staff   544B  2 14 06:18 stub_ui
  9. -rw-r--r--   1 chengchao  staff   843K  2 14 06:19 vm_outline.dill
  10. -rw-r--r--   1 chengchao  staff   843K  2 14 06:19 vm_outline_strong.dill

 

Download目录

在我们执行flutter doctor命令后下载相关文件的零时存放的地方

 

 

 

四 总结

 

这一篇文章主要通过安装Flutter SDK，对SDK内部结构有了一定了解。我们大概知道了：

  1. Flutter SDK 有四个不同的Channel
  2. Flutter SDK依赖的Dart SDK是内部自动下载的（也可以手动指定）
  3. Flutter命令
  4. Flutter SDK提供的功能主要都在package目录下，其中的flutter目录下包含了Framework的类库功能
  5. Flutter SDK提供了一个flutter.jar和flutter.framework来和flutter打交道，以便Android 和 IOS能将flutter程序集成到原生应用中。

 

如果本文对您有帮助，可以扫描下方二维码打赏！您的支持是我的动力！

微信打赏 支付宝打赏

声明：本文内容由网友自发贡献，不代表【wpsshop博客】立场，版权归原作者所有，本站不承担相应法律责任。如您发现有侵权的内容，请联系我们。转载请注明出处：https://www.wpsshop.cn/w/IT小白/article/detail/307665
推荐阅读
相关标签

Copyright © 2003-2013 www.wpsshop.cn 版权所有，并保留所有权利。

  

闽ICP备14008679号