** 導(dǎo)語(yǔ) **mac系統(tǒng)上進(jìn)行flutter engine編譯和應(yīng)用的介紹
官方介紹
環(huán)境依賴準(zhǔn)備
- mac 環(huán)境弥臼。
- 安裝homebrew
/usr/bin/ruby -e "$(curl -fsSL https://raw.githubusercontent.com/Homebrew/install/master/install)"
- 安裝ant缩搅、ninja
brew install ant
brew install ninja
- 使用默認(rèn)python 2.7
- 一些網(wǎng)絡(luò)可能會(huì)有chrome-infra-packages.appspot.com報(bào)錯(cuò)腹殿,可能會(huì)下載一些依賴失敗蛤克。編輯host: sudo vi /etc/hosts
# flutter engine
172.217.160.112 storage.l.googleusercontent.com
172.217.160.112 commondatastorage.googleapis.com
172.217.160.68 googleapis.com
172.217.160.116 chrome-infra-packages.appspot.com
172.217.160.116 appspot-preview.l.google.com
- 安裝depot_tools
git clone https://chromium.googlesource.com/chromium/tools/depot_tools.git
export PATH=$PATH:/yourpath/to/depot_tools //添加環(huán)境變量
<a name="Omhjf"></a>
源碼下載
- fork一份flutter engine源代碼沙绝,官方不建議直接用官方git代碼進(jìn)行編譯修改疏之。官方的flutter engine源碼:https://github.com/flutter/engine<br />
- 新建目錄engine 在engine中添加.gclient文件胆筒,內(nèi)容如下朽色,替換your_name_here為你的github name<br />
solutions = [
{
"managed": False,
"name": "src/flutter",
"url": "git@github.com:<your_name_here>/engine.git",
"custom_deps": {},
"deps_file": "DEPS",
"safesync_url": "",
},
]
- 拉取代碼和依賴拘悦,在engine目錄下執(zhí)行g(shù)client sync, 等待齿兔。。础米。分苇。<br />
cd engine
gclient sync //拉取Flutter引擎所有依賴的關(guān)聯(lián)庫(kù)
編譯源碼
- 編譯前,需要調(diào)整到對(duì)應(yīng)flutter工具的提交版本屁桑,不然可能會(huì)報(bào)錯(cuò)医寿。<br />
# 查看engine版本vim /path/to/flutter/bin/internal/engine.version
cd /path/to/engine/src/flutter
git reset --hard xxxxxxxxxxxxxxxxx
gclient sync -D --with_branch_heads --with_tags
- 又是一小段等待,終于可以編譯engine了蘑斧。
- 這里以android debug模式編譯為例靖秩,更多的編譯模式參考官網(wǎng)。<br />
cd engine/src //進(jìn)入src目錄
./flutter/tools/gn --runtime-mode debug //生成Host編譯產(chǎn)物存放文件
./flutter/tools/gn --android --runtime-mode debug //生成android編譯產(chǎn)物存放文件
ninja -C out/host_debug -j 6
ninja -C out/android_debug -j 6
- 大約一個(gè)小時(shí)的等待后竖瘾,編譯成功沟突,后續(xù)修改的話是增量編譯,不需要等那么久(也要幾分鐘捕传,哈哈哈哈~)
使用編譯的engine
- 命令行方式<br />
flutter create test_engine //創(chuàng)建flutter工程
cd test_engine
flutter run --local-engine-src-path /path/to/engine/src --local-engine=android_debug
- android studio方式<br />
- 創(chuàng)建flutter工程惠拭, 在gradle.properties中新增localEngineOut指向你的編譯結(jié)果目錄
- /path/to/engine/src/out/android_debug //這是真機(jī)模式,不適用于模擬器

image.png
- 模擬器版本編譯<br />
cd engine/src
./flutter/tools/gn --android --android-cpu x64 --runtime-mode debug
ninja -C out/android_debug_x64 -j 6
使用方式庸论,將 local-engine 或者 localEngineOut 指向 android_debug_x64<br />

image.png
編輯源碼
- 編輯源碼职辅,可使用vscode棒呛,把engine/out/compile_commands.json 文件鏈接到 engine/src/flutter目錄下,以使vscode支持代碼跳轉(zhuǎn)能力<br />
cd engine/src/flutter
ln -s ../out/compile_commands.json ./
- 用vscode打開(kāi) engine/src/flutter域携,可進(jìn)行編輯簇秒,java代碼跳轉(zhuǎn)能力貌似還有點(diǎn)弱。
- vscode可以裝一些c++ java flutter dart json的插件
- 插件安裝方法:

image.png
- 修改源碼查看編譯是否生效效果<br />
- java層如:

image.png
- 使用 ninja -C out/android_debug_x64 -j 6 重新編譯(增量)
- 運(yùn)行效果:

image.png

image.png
- c++層<br />

image.png
- 使用 ninja -C out/android_debug_x64 -j 6 重新編譯(增量)
- 運(yùn)行效果:

image.png
- dart層修改<br />

image.png
- 使用 ninja -C out/android_debug_x64 -j 6 重新編譯(增量)
- 運(yùn)行效果:

image.png