VSCode : Remote Containers の備忘録

はじめに

Remote Containersでいい感じに構築できたので、備忘録です。
(そのうちまとめたいな・・・と思いつつ)

Remote Containersは遅いかも?

create-react-appで作成したものにDockerFileをそのまま追加して、Remote Containersで起動しました。
動きがローカルと比べると激遅です!!

改善 改造

遅延の原因

Remote Containersで作成されたspaceでnpm startするとすごく遅くなりました。
ほかのspace(directory)でnpm startするとローカルと同じくらいの速度でした。

方針

1. 別のspaceで実施する
2. rsyncで能動的に同期する
3. 起動時に同期する

コード

以下のように追加しました。

Dockerfile

FROM node:latest
WORKDIR /usr/app

RUN npm install -g create-react-app
RUN apt-get update -y && apt-get install -y rsync

# ライブ編集を有効か
ENV CHOKIDAR_USEPOLLING=true

# /usr/app に作業ファイルをcopyする
COPY . .

.devcontainer

...
	"postCreateCommand": "npm install",
	"postStartCommand": "rsync -ahv --stats --delete --exclude /node_modules --exclude /build --size-only ${DEV_CONTAINER} /usr/app/",
	"workspaceFolder": "/usr/app",
	"remoteEnv": {"DEV_CONTAINER": "/workspaces/${localWorkspaceFolderBasename}/" },
...

package.json

...
 "scripts": {
    "start": "node scripts/start.js",
    "build": "node scripts/build.js",
    "test": "node scripts/test.js",
    "local": "rsync -ahv --stats --delete /usr/app/ ${DEV_CONTAINER} --exclude /node_modules --exclude /build --size-only"
  },
...

注意点

Remote Containers上では、必ずnpm run localを行ってから閉じましょう・・・
でないと変更が消えてしまいます