📘

Electronの開発用Dockerコンテナ作成

2024/07/22に公開

環境

OS: Ubuntu 22.04.4 LTS
コンテナベースイメージ: Ubuntu:22.04
Docker: 27.0.3
docker-compose: v2.10.0
GPU:

+---------------------------------------------------------------------------------------+
| NVIDIA-SMI 545.29.06              Driver Version: 545.29.06    CUDA Version: 12.3     |
|-----------------------------------------+----------------------+----------------------+
| GPU  Name                 Persistence-M | Bus-Id        Disp.A | Volatile Uncorr. ECC |
| Fan  Temp   Perf          Pwr:Usage/Cap |         Memory-Usage | GPU-Util  Compute M. |
|                                         |                      |               MIG M. |
|=========================================+======================+======================|
|   0  NVIDIA GeForce RTX 3060 ...    Off | 00000000:01:00.0  On |                  N/A |
| N/A   55C    P8              12W /  80W |    323MiB /  6144MiB |      0%      Default |
|                                         |                      |                  N/A |
+-----------------------------------------+----------------------+----------------------+

※Dockerとdocker composeが使用できる環境を構築済みであること

Dockerfile & docker-compose.yml

Dockerfile
FROM ubuntu:22.04

# 必要な依存関係
RUN apt-get update \
    && apt-get -y install \
    libgtkextra-dev \
    libgconf2-dev \
    libnss3 \
    libasound2 \
    libxtst-dev \
    libxss1 \
    libgtk-3-0 \
    libdrm2 \
    libgbm1 \
    libcanberra-gtk*

RUN apt-get update \
    && apt-get -y install \
    curl \
    sudo

RUN apt-get update && \
apt-get install -y nodejs npm && \
npm install n -g && \
apt-get purge -y nodejs npm && \
n stable

# sudoを使用できるユーザを追加
ARG USERNAME=hogehoge
ARG GROUPNAME=fugafuga
ARG PASSWORD=pienpien
ARG UID=1000
ARG GID=1000
RUN groupadd -g $GID $GROUPNAME && \
    useradd -m -s /bin/bash -u $UID -g $GID -G sudo $USERNAME && \
    echo $USERNAME:$PASSWORD | chpasswd && \
    echo "$USERNAME   ALL=(ALL) NOPASSWD:ALL" >> /etc/sudoers

COPY ./app /$USERNAME/app

USER $USERNAME
WORKDIR /home/$USERNAME/app
docker-compose.yml
version: '3'
services:
  electron_app:
    build:
      context: ./
      dockerfile: Dockerfile
    image: electron_app_image
    container_name: electron_app_container
    environment:
      - QT_X11_NO_MITSHM 1
      - NO_AT_BRIDGE 1
      - DISPLAY=:1
      - NVIDIA_VISIBLE_DEVICES=all
      - NVIDIA_DRIVER_CAPABILITIES=all
    volumes:
      - ./app:/home/hogehoge/app/
      - /tmp/.X11-unix:/tmp/.X11-unix
    deploy:
      resources:
        reservations:
          devices:
            - driver: nvidia
              count: all
              capabilities: [gpu]
    network_mode: host
    command: bash -c 'sudo /etc/init.d/dbus start && tail -F /dev/null'
    tty: true
    privileged: true
    stdin_open: true

動作確認は公式のチュートリアルのクイックスタートを実施

https://www.electronjs.org/ja/docs/latest/tutorial/quick-start

課題

npm startを実行すると、下記のエラーが発生、、、、、
アプリは動いてそうなので、取り敢えず無視

error
[481:0722/110410.129347:ERROR:bus.cc(407)] Failed to connect to the bus: Could not parse server address: Unknown address type (examples of valid types are "tcp" and on UNIX "unix")

Discussion