👩‍💻

#128 UV × Flet でWSLとWindowsの開発環境を構築してみた

に公開

はじめに

最近、PythonのライブラリであるFletを使用してGUIアプリを作成していました。
WSL環境で開発を行い、Windows環境でビルドする。というフローで作成することにしましたが、Windows環境でのビルド部分などで少し詰まる部分がありましたのでその辺りも含めて書いていきたいと思います。

前提

WSL バージョン: 2.3.24.0
カーネル バージョン: 5.15.153.1-2
WSLg バージョン: 1.0.65
MSRDC バージョン: 1.2.5620
Direct3D バージョン: 1.611.1-81528511
DXCore バージョン: 10.0.26100.1-240331-1435.ge-release
Windows バージョン: 10.0.22631.4602

という環境で進めていきます。

UVのインストール

UVとは

Rustで記述された高速に動作するPythonのパッケージ・プロジェクトマネージャーです。
他の候補としてはPoetryとpyenvなどがありましたがWSLとWindowsの両環境に同時にインストールすると競合などが発生しましたので、ALL IN ONEかつ導入のハードルも低い & 動作が速いということでUVを使用することにしました。

インストール(Windows)

公式 のインストール手順に従い、powershellでコマンドを実行していきます。

powershell
powershell -ExecutionPolicy ByPass -c "irm https://astral.sh/uv/install.ps1 | iex"

powershellを再起動して以下コマンドを実行してバージョンが表示されれば完了です。

powershell
uv --version

インストール(WSL)

Windowsと同様、公式 のインストール手順に従い、powershellでコマンドを実行していきます。

curl -LsSf https://astral.sh/uv/install.sh | sh

shellを再起動して以下コマンドを実行してバージョンが表示されれば完了です。

uv --version

Fletプロジェクトのセットアップ(WSL)

UVでプロジェクトを作成する

以下コマンドでPythonのバージョンを 3.11 系で指定し、UVの新規プロジェクトを作成します。

mkdir flet-demo
cd flet-demo
uv init . --version 3.11

すると以下のファイルが作成されます。

.git .gitignore .python-version README.md  hello.py  pyproject.toml

ここにFletの依存パッケージを追加します。

uv add flet

そして以下コマンドでFletアプリを作成します。

uv run flet create .
Installing flet-cli 0.25.2 package...Unable to upgrade "flet-cli" package to version 0.25.2. Please use "pip install 'flet[all]==0.25.2' --upgrade" command to upgrade Flet.

※以上のような表示が出た場合には以下コマンドを実行し再度Fletアプリの作成コマンドを実行してください。

uv pip install 'flet[all]==0.25.2' --upgrade
The app has been created.

Run the app:

flet run

以上のメッセージが表示されればFletのセットアップは完了です。

Fletアプリの起動

以下コマンドでFletアプリを仮想環境から起動できます。

uv run flet run

ですが恐らく以下のようなエラーが出力されると思います。

error while loading shared libraries: libgstapp-1.0.so.0: cannot open shared object file: No such file or directory

解消するために以下コマンドで不足しているライブラリをインストールしていきます。

sudo apt update
sudo apt install -y libgstreamer1.0-0 gstreamer1.0-plugins-base gstreamer1.0-plugins-good gstreamer1.0-plugins-bad gstreamer1.0-plugins-ugly gstreamer1.0-libav gstreamer1.0-tools
sudo apt install libmpv-dev libmpv2
sudo  ln -s /usr/lib/x86_64-linux-gnu/libmpv.so /usr/lib/libmpv.so.1

再度runコマンドを実行し、GUIが立ち上がればFletのセットアップも完了です。

Fletアプリのビルド(Windows)

Windowsを対象に実行可能ファイルをビルドする場合、Windows環境内でbuildコマンドを実行する必要があります。
よって、Windows環境でFletアプリをビルドするのに必要な手順を記載します。

必要なものは以下の通りです。

  1. VisualStudio C++
  2. Flutter SDK

VisualStudio C++ のインストール

こちら から Community 2022 版をダウンロードする

インストールを進め、以下画像の通りにインストールを開始

インストールが無事に終了すれば完了です。

Flutter SDK をインストール

今回は こちら からバージョンが 3.24.5 の物をダウンロードします。
※(2025/01/19現在) 最新バージョンをダウンロードするとビルドに失敗します。

  1. ダウンロードした zip ファイルを C:\Users\[ユーザー名]\AppData\Local 配下に解凍します。
  2. 環境変数のPathに
    C:\Users\[ユーザー名]\AppData\Local\flutter\bin を通します。

以下コマンドを実行し出力を確認します。

flutter doctor

以上の出力で、特に

[] Visual Studio - develop Windows apps (Visual Studio Community 2022 17.12.3)

となっていれば完了です。

ビルド

先程セットアップしたFletアプリをWindows環境に移動させます。
そして、Windows環境でもrunコマンドで起動できるか確認します。
正しく起動できれば以下コマンドでビルドを実行できます。

uv run flet build windows

ビルドが完了すると、
project/build/windows/ 配下に実行可能ファイルが出力されるので実行し正しく起動できればビルドの手順も完了です。

※ビルドが失敗する場合、Windowsの設定から
システム => 開発者向け => 開発者モード をONにします。

おまけ

Seleniumを使用してスクレイピングを行うなどのケースもあると思いますので、WSL上で動作確認ができるようにChromeをインストールしてみます。

Linux 向け Google Chrome をインストールする を参考にインストールを行います。

一時フォルダを作成し移動します。

mkdir tmp/ && cd ~/tmp

パッケージのダウンロードとインストールを行います。

wget https://dl.google.com/linux/direct/google-chrome-stable_current_amd64.deb
sudo apt install --fix-missing ./google-chrome-stable_current_amd64.deb

以下のコマンドでChromeが立ち上がれば完了です。

google-chrome

使った一時ファイルを削除しておきます。

rm google-chrome-stable_current_amd64.deb

こうするとWSL上でSeleniumの動作確認をしながら開発することが可能になります。

おわりに

Flet単体でGUIアプリを開発する場合、Dockerで構築し動作確認は --web で起動したFletアプリで行うのが良いと思います。
作成しているアプリがSeleniumを組み込む必要があり、動作確認を行いたかったという事情で今回のような構築となりました。
今後はDocker上でも動作確認できる状況を作れるように色々と調べてみたいと思います。
ここまでご覧いただきありがとうございました。

Discussion