はじめに

Flutterアプリケーションのデバッグ時にGTK/GDK と Flutter Engine を自前でビルドしてログを取ってみようという話になり、試していたところ色々と詰まったので備忘録として手順を残しておきます。

前提条件

OS: Ubuntu20.04
CPU: Intel Core-i7 13700
depot toolがインストール済みであること
- インストールしていない場合はこちらの手順に従ってインストールしてください

手順

1. GTK/GDKのビルド

以下のコマンドでGTKのビルドに必要な依存関係をインストールします

sudo apt update
sudo apt install -y build-essential meson ninja-build libglib2.0-dev libcairo2-dev libpango1.0-dev libgdk-pixbuf2.0-dev libatk1.0-dev libepoxy-dev libx11-dev libxi-dev libxext-dev libxrandr-dev libxcursor-dev libxdamage-dev libxcomposite-dev libxinerama-dev libxfixes-dev libwayland-dev libxkbcommon-dev wayland-protocols libdbus-1-dev libgirepository1.0-dev libegl1-mesa-dev libfontconfig1-dev libfreetype6-dev libharfbuzz-dev libfribidi-dev libxrender-dev libx11-xcb-dev libxcb1-dev libxcb-shm0-dev libxcb-xfixes0-dev libxkbcommon-x11-dev libgtk-3-dev gtk-doc-tools gobject-introspection

以下のコマンドでインストールされているGTKのバージョンを確認します(参考)。

dpkg -l "*gtk-3.0*" | grep ii

実行すると以下のような出力が得られ、下記の場合だとバージョンは3.24.20であることがわかります。

ii  gir1.2-gtk-3.0:amd64 3.24.20-0ubuntu1.2 amd64        GTK graphical user interface library -- gir bindings
ii  libgtk-3-0:amd64     3.24.20-0ubuntu1.2 amd64        GTK graphical user interface library
ii  libgtk-3-bin         3.24.20-0ubuntu1.2 amd64        programs for the GTK graphical user interface library
ii  libgtk-3-common      3.24.20-0ubuntu1.2 all          common files for the GTK graphical user interface library
ii  libgtk-3-dev:amd64   3.24.20-0ubuntu1.2 amd64        development files for the GTK library

以下のコマンドでGTKをcloneし、GTKのバージョンを確認して得られたバージョンにcheckoutします

git clone https://github.com/GNOME/gtk
cd gtk
git checkout 3.24.20

以下のコマンドでGTKをビルドします。
<ユーザー名>の部分は適宜書き換えてください。

meson setup build
cd build
meson setup --prefix=/home/<ユーザー名>/.local --buildtype=debug --reconfigure
ninja install

2. Flutter Engineのビルド

以下のコマンドでFlutter Engineのビルドに必要な依存関係をインストールします。

sudo apt update
sudo apt install -y curl unzip clang cmake ninja-build pkg-config libgtk-3-dev liblzma-dev xz-utils libasound2-dev libpulse-dev libudev-dev libglu1-mesa-dev mesa-common-dev
sudo apt-get install --reinstall libxxf86vm-dev

以下のコマンドで現在使用しているFlutterのバージョンを確認します。

flutter --version

実行すると以下のような出力が得られ、下記の場合だとバージョンは3.24.1であることがわかります。

Flutter 3.24.1 • channel stable • https://github.com/flutter/flutter.git
Framework • revision 5874a72aa4 (4 weeks ago) • 2024-08-20 16:46:00 -0500
Engine • revision c9b9d5780d
Tools • Dart 3.5.1 • DevTools 2.37.2

以下のコマンドで作業用ディレクトリを作成しその中に入ります。

mkdir ~/flutter-engine && cd ~/flutter-engine

.gclientを以下のように手動で作成します。

nano .gclient

solutions = [
  {
    "name": "src/flutter",
    "url": "https://github.com/flutter/engine.git",
    "deps_file": "DEPS",
    "managed": False,
    "custom_deps": {},
  },
]

以下のコマンドでFlutter Engineのソースコードをfetchします。
「3.24.1」の部分は適宜現在使用しているFlutterのバージョンに変えてください。

gclient sync --revision src/flutter@3.24.1

以下のコマンドでPKG_CONFIG_PATHを設定し先にビルドしたGTK/GDKを参照できるようにします。
<ユーザー名>の部分は適宜書き換えてください。

export PKG_CONFIG_PATH=/home/<ユーザー名>/.local/lib/x86_64-linux-gnu/pkgconfig:/lib/x86_64-linux-gnu/pkgconfig

以下のコマンドでビルドします。

cd ~/flutter-engine/src
./flutter/tools/gn --unoptimized --no-goma --target-sysroot=/
ninja -C out/host_debug_unopt

3.デバッグ対象のFlutterアプリケーションの起動

デバッグ対象のFlutterアプリケーションのディレクトリに移動したあと以下のコマンドを実行します。

LD_LIBRARY_PATH=/home/<ユーザー名>/.local/lib/x86_64-linux-gnu flutter run --local-engine-src-path ~/flutter-engine/src/ --local-engine host_debug_unopt --local-engine-host host_debug_unopt -v

教訓

Chat GPT Plusは課金しておくと幸せになれる。