手把手教你編譯Flutter engine

共田君發表於2018-12-27
編譯Flutter

一圖說明

歡迎關注姊妹篇《手把手教你解決flutter engine記憶體洩漏》

flutter已經到了1.0了，小夥伴還沒有使用的趕緊試試吧，如果想更深入的把玩，可以嘗試編譯一下官方的flutter engine，地址在 github.com/flutter/eng…

為什麼要編譯engine

  1. 學習
  2. 改造 第二篇會介紹怎麼樣改造engine來解決記憶體洩漏問題，滿足自己業務需求。

事前準備

  • 機器，linux，mac，或windows
  • git 命令
  • IDE , android stuido或xcode
  • ssh客戶端，使用者github身份驗證
  • python，預設自帶
  • gclient 安裝地址?
$ git clone https://chromium.googlesource.com/chromium/tools/depot_tools.git
$ export PATH=$PATH:/path/to/depot_tools
複製程式碼
  • python --version 需要2.7版本

如何編

1. 下載

  • 1.1 從官網fork工程到自己工程，github.com/flutter/eng…
  • 1.2 配置ssh祕鑰 help.github.com/articles/ge…
  • 1.3 在flutter工程的同級目錄執行 gclone xxx, xxx為你自己fork後的engine地址，為了後面方便
  • 1.4 在engine目錄建立.gclient檔案 ,執行
$ vim .gclient
複製程式碼

內容為

solutions = [
  {
    "managed": False,
    "name": "src/flutter",
    "url": "git@github.com:<your_name_here>/engine.git",
    "custom_deps": {},
    "deps_file": "DEPS",
    "safesync_url": "",
  },
]
複製程式碼
  • 1.5 切換到engine目錄
$ cd engine
複製程式碼
  • 1.6 獲取Flutter所依賴的所有原始碼，時間超長，大概一個半小時
$ gclient sync
複製程式碼
  • 1.7 進入src/flutter目錄，拉取操作
$ cd src/flutter
$ git remote add upstream git@github.com:flutter/engine.git
$ git pull upstream master
複製程式碼

後面的操作不要看官方的了，最好的文件已經江湖失傳了，僅此一篇

2 回滾

  • 2.1 找到當前flutter對應的engine版本 類似
$  cat /Users/boo/Documents/flutter/bin/internal/engine.version 
複製程式碼

如1.0版的engine版本號，這是一個commit號

7375a0f414bde4bc941e623482221db2fc8c4ab5
複製程式碼
  • 2.2 回滾當時提交版本 執行命令
bogon:src boo$ git reset --hard 7375a0f414bde4bc941e623482221db2fc8c4ab5 
HEAD is now at 7375a0 Fix dart/create_updated_flutter_deps script so it actually updates flutter/DEPS. (#175)

複製程式碼

檢視當前版本號

$  git rev-parse HEAD
複製程式碼

只同步指定commit版本命令

gclient sync --with_branch_heads --with_tags  
複製程式碼

3. 建立engine工程

編譯選項具體可以參考 github.com/Natoto/flut…

以ios為例

生成ios裝置用的未經編譯的工程

$ ./flutter/tools/gn --ios --unoptimized
複製程式碼

生成ios裝置用的工程，不帶符號表

./flutter/tools/gn --ios
複製程式碼

生成release工程

$ ./flutter/tools/gn --ios --runtime-mode=release
複製程式碼

生成模擬器版本工程

./flutter/tools/gn --ios --simulator 
複製程式碼

生成模擬器用的未優化版本

./flutter/tools/gn --ios --simulator --unoptimized  
複製程式碼

也可以可以指定cpu

./flutter/tools/gn --runtime-mode=release --ios --ios-cpu=arm64
複製程式碼

4. 編譯

一種編譯模式三千多個檔案，大概一個半小時

編譯relase工程

$ ninja -C out/ios_release
複製程式碼

編譯裝置用debug模式

 ninja -C out/ios_debug && ninja -C out/host_debug
複製程式碼

編譯裝置用debug模式,帶符號

 ninja -C out/ios_debug_unopt && ninja -C out/host_debug_unopt
複製程式碼

編譯模擬器用debug模式

 ninja -C out/ios_debug_sim_unopt && ninja -C out/host_debug_unopt
複製程式碼

如何用

經過漫長的編譯之後，終於可以看到產物了，flutter.framework 就是對應模式的產物 有兩種使用方法，一邊開發一邊測試，或無需修改，直接使用

  1. 在工程中使用
flutter run --local-engine-src-path /Users/boo/Documents/engine/src --local-engine=ios_debug_unopt
複製程式碼
  1. 直接拷貝替換掉flutter目錄裡面的engine就可以立即使用了 /Users/boo/Documents/flutter/bin/cache/artifacts/engine

YY Flutter技術積累相關連結

一行程式碼教你解決FlutterPlatformViews記憶體洩露 by AShawn

手把手教你在Flutter專案優雅的使用ORM資料庫 by williamwen1986

flutter通用基礎庫flutter_luakit_plugin by williamwen1986

github - flutter_luakit_plugin使用例子 by williamwen1986

手把手教你編譯Flutter engine by 共田君

手把手教你解決 Flutter engine 記憶體洩漏 by 共田君

github - 編譯產物下載 修復記憶體洩漏後的flutter engine（可直接使用）by 共田君

github demo - 修復記憶體洩漏後的flutter engine by 共田君

持續更新中...

相關文章