WSL2のX-ServerでGUI表示する際に「export DISPLAY=:0.0」が効かない

はじめに
環境
遭遇した問題と解決方法
終わりに

はじめに

WSL2内のアプリをX-Server経由でWindows側にGUI表示させようとして、戸惑った点についてまとめます。

WSL2やX-Serverの設定については割愛します。

環境

ホスト
- Windows10 Professional
WSL2
- Ubuntu 18.04

WSL2の設定などはこちらの記事を参考してください。

PhpStorm on WSL2でWindowsに依存しない開発環境を作る

はじめに WindowsでPHPなどの開発をしていると色々トラブルに見舞われます。 WSL2やWindows terminalの登場で、端末環境はほぼLinux同等のものが動くようになりました。しかし、コード編集にWindows側のIDE...

遭遇した問題と解決方法

WSL2のX環境をセットアップして、いざGUI表示しよう！と思ったら表示されない。

下記エラーが表示されていました。

Error: Can't open display: :0.0

VcXsrv自体は起動しているので、export DISPLAY=:0.0が悪いのかと思い色々試す。

どうやら、localhostではWSL2側からホストのIPアドレスが解決できず、X環境に接続できない模様。

export DISPLAY=192.168.0.100:0.0のようにホストのIPアドレスを直打ちとしたら動きました。
（192.168.0.100はホストのIPアドレス）
IPアドレス部分は、ipconfigコマンドで表示される「イーサネットアダプター vEthernet (WSL):」となっているものでもよいらしい。

ホストのIPアドレスを直書きするのはスマートではないので色々検索。

下記Issueが上がっていました。

Can't use X-Server in WSL 2 · Issue #4106 · microsoft/WSL

Your Windows build number: (Type ver at a Windows Command Prompt) Microsoft Windows with Ubuntu 18.04, WSL 2. VcXsrv X Server Version 1.20.1.4 What you're doing...

下記コードを.bashrcに設定しておけばよいらしい。

export DISPLAY=$(cat /etc/resolv.conf | grep nameserver | awk '{print $2}'):0.0

加えてWindowsでファイアウォールを設定
VcXsrvを許可する

設定反映のため、WSLを再起動して確認。

。。。動いた！

終わりに

開発環境がすべてWSL2側で完結するので、Windows側にGitやDockerなど入れなくても済むのが良いです。

また、IDEはPhpStormを使っているのですが、GitやdockerがWSL2内のものを設定できるので、環境トラブルの面倒臭さが減って良い感じ。

私はWindows10のPro版で試しているのですが、Home版でも同じように動くかは不明。