31
30

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?

More than 3 years have passed since last update.

WSL2+VSCode Dev ContainerでFilesharingの警告

Posted at

環境

OS: Windows 10 Pro バージョン 2004 (19041.572)
Visual Studio Code: 1.50.1
Docker Desktop: 2.5.0.0 (49427) stable
Docker: version 19.03.13, build 4484c46d9d
自分: DockerやWSLのことよくわかってないけどなんとなく使っている
WSL関連
$ wsl -l -v --all
  NAME                   STATE           VERSION
* docker-desktop-data    Running         2
  docker-desktop         Running         2
  Ubuntu                 Running         2
# WSL2上のUbuntu
$ cat /etc/os-release
NAME="Ubuntu"
VERSION="20.04 LTS (Focal Fossa)"
ID=ubuntu
ID_LIKE=debian
PRETTY_NAME="Ubuntu 20.04 LTS"
VERSION_ID="20.04"
HOME_URL="https://www.ubuntu.com/"
SUPPORT_URL="https://help.ubuntu.com/"
BUG_REPORT_URL="https://bugs.launchpad.net/ubuntu/"
PRIVACY_POLICY_URL="https://www.ubuntu.com/legal/terms-and-policies/privacy-policy"
VERSION_CODENAME=focal
UBUNTU_CODENAME=focal
.wslconfig
[wsl2]
memory=2GB # ←ホストマシンのメモリがしょぼいので……
swap=0

使用したコード

project
    └ .devcontainer
        ├ devcontainer.json
        └ docker-compose.yml
各ファイルの中身
devcontainer.json
{
  "name": "wsl-devcontainer-example",
  "dockerComposeFile": "docker-compose.yml",
  "service": "web",
  "workspaceFolder": "/workspace"
}
docker-compose.yml
version: '3'
services:
  web:
    image: node:14-alpine
    tty: true
    volumes:
      - ..:/workspace

問題

開発コンテナを開いたら、以下のような警告が出た。

poor.png

Docker Desktop - Filesharing
Docker Desktop has detected that you shared a Windows file into a WSL 2 container, which may perform poorly. Click here for more details.

(補足)そもそもdevcontainerって何
  • VSCodeのメチャ便利機能
  • 開発環境をDockerコンテナで作るのでホスト環境を汚さずにすむ
  • 設定ファイルの用意さえすればVSCodeで開いてちょっとボタン押すだけで↑の環境ができてすごい楽
  • 設定ファイルとDocker関連ファイルをリポジトリに入れておけば開発メンバーで環境を統一できてすごい
  • Developing inside a Container using Visual Studio Code Remote Development

なんの警告?

上記リンク先から一部引用:

To get the best out of the file system performance when bind-mounting files, we recommend storing source code and other data that is bind-mounted into Linux containers (i.e., with docker run -v <host-path>:<container-path>) in the Linux file system, rather than the Windows file system. You can also refer to the recommendation from Microsoft.

ファイルをバインドマウントするときファイルシステムのパフォーマンスを最大限に活用するためには、ソースコードやその他、Linuxコンテナに(例えばdocker run -v <host-path>:<container-path>を使って)バインドマウントされるデータを、WindowsファイルシステムではなくLinuxファイルシステムに保存することが推奨されます。マイクロソフトからの推奨事項も参考にしてください。

WSL2ではWindowsファイルシステム上に保存したファイルにWSL上のコマンドからアクセスするのはかなり遅いし一部機能が動かない、という警告のようだ。
確かに、npm installのようなファイルを大量に書き込む処理をすると、めちゃめちゃ遅いのが体感できる。

解決方法

Windowsファイルシステムではなく、WSL上で作ったLinuxファイルシステムのディレクトリをdevcontainer(開発用コンテナ)にバインドマウントしてやればよいはずである。

ダメな方法(1):sob:

ただdocker-compose.ymlを以下のようにしてももちろんダメ。

docker-compose.yml
version: '3'
services:
  web:
    image: node:14-alpine
    tty: true
    volumes:
      - \\wsl$\Ubuntu\home\username\workspace:/workspace # ✖✖✖

docker-compose\\wsl$\...をパスとして認識できないようで、動かない。さらに、これだと相対パスが使えないので、プロジェクトメンバーで共有もできない。そもそも「Windowsがネットワークドライブとしてマウントしたフォルダ」を指定しても、意味がない気がする。なにもかもがダメ:sob::sob::sob:

ダメな方法(2):sob:

以下もダメ。

docker-compose.yml
version: '3'
services:
  web:
    image: node:14-alpine
    tty: true
    volumes:
      - /mnt/c/Users/username/workspace:/workspace # ✖✖✖

これもやはり相対パスが使えない。そして「WSLがマウントしたWindowsファイルシステム上のフォルダ」を指定しているので、意味がない気がする。(動くのかな?試してません……)

正しい方法:smile:

以下のドキュメントに、ステップバイステップのチュートリアルがある。

(1) WSLとdockerの環境を確認

前述のチュートリアルにもある通り、以下の環境が必要。

docker1.png
docker2.png

設定ができていると、WSL上のUbuntu上にdockerをインストールしなくても、dockerdocker-composeコマンドが使えるようになる。これが重要っぽい?(WSLからコンテナを起動するので)

WSL上のUbuntuで実行
$ docker --version
Docker version 19.03.13, build 4484c46d9d
$ which docker
/usr/bin/docker
$ ls -al /usr/bin/docker
lrwxrwxrwx 1 root root 48 Nov  5 10:47 /usr/bin/docker -> /mnt/wsl/docker-desktop/cli-tools/usr/bin/docker

(2) WSLからVSCodeを開く

WSLのUbuntuのシェルから操作する。

WSL上のUbuntuで実行
$ cd ~
$ git clone https://github.com/mattwojo/helloworld-django.git
$ cd helloworld-django
$ code .

VSCodeが開くと、プロジェクト内の.devcontainerフォルダを認識して「Dev Container設定があるけど、コンテナで開く?」というようなメッセージを出してくるのだが、これは無視する:no_good:
どうも、このメッセージのボタンからコンテナを開くと、せっかくWSLからVSCodeを起動していても無視されて、Windowsから開発用コンテナを実行しようとしてしまうみたい……?

warn.png
:no_good::no_good::no_good:

(3) VSCode(WSL)からコンテナを開く

  1. コマンドパレットからRemote-Containers: Open Folder in Container...を選択
  2. プロジェクトフォルダを選択(最初から選択されてたのでそのままOK)

この後、ドキュメントには

プロジェクトフォルダー (リポジトリ) に DevContainer 構成がまだないため、コンテナー定義の一覧が表示されます。

とあったが、現行バージョンだとリポジトリ内に.devcontainerがすでに存在しているため、何も聞かれずイメージのビルドが始まる。(けっこう時間がかかった……)

VSCode上で統合ターミナルを開き、Pythonのバージョンを確認してみる。

$ python --version
Python 3.9.0

WSL(Ubuntu)にはpythonを入れていないので、コンテナのターミナルであることがわかる。
冒頭に示したFilesharingの警告も出ない!
(ちなみに、サンプルプログラムを実行するにはpython3 -m pip install djangoが必要だった。)

元のファイルで試す

  1. 問題が出ていた.devcontainerを含んだプロジェクトフォルダを、\\wsl$\Ubuntu\home\username以下に移動(Windowsのエクスプローラーで開いてコピーしただけ)
  2. WSLのUbuntuのシェルからcode .
  3. Remote-Containers: Open Folder in Container...
  4. できた!

次回からは?

毎回これをやるのは面倒だな……と思ったが、一度開けば次からはVSCodeの「最近」のところに[Dev Container]と表示され、一発で開けるようになっていた。

recent.png

まとめ

  1. コードをWSLのLinuxファイルシステム上に配置する
  2. VSCodeをWSLからcodeコマンドで開く ←これが重要
  3. WSLで開いたVSCodeからRemote-Containers: Open Folder in Container...

その他の参考サイト

31
30
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
31
30

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?