傑森前端

研究了一下，做個筆記 

https://code.visualstudio.com/docs/remote/remote-overview

環境建置

1. 下載 docker-desktop - https://www.docker.com/products/docker-desktop
2. 下載 vscode - https://code.visualstudio.com/
3. 設定docker-desktop
4. 下載 vscode外掛 Docker 與 Remote Development

使用

1. 選擇專案資料夾
2. cmd + shift + p 輸入 Add development Container Configuration Files
3. 選擇自己想要的環境
4. cmd + shift + p 輸入 Open Folder in Container

目前嘗試了兩種node環境使用方法

一種是使用dockerFile

• 缺點每次都要創建一個新的image浪費空間
• 優點vscode裡面node預設直接用

一種是用docker compose

• 缺點需要稍微設定一下要使用的image
• 優點可以使用同一個鏡像檔案來啟動容器

＃devcontainer.json
// For format details, see https://aka.ms/devcontainer.json. For config options, see the README at:
// https://github.com/microsoft/vscode-dev-containers/tree/v0.209.6/containers/javascript-node-mongo
// Update the VARIANT arg in docker-compose.yml to pick a Node.js version
{
	"name": "Node.js",
	"dockerComposeFile": "docker-compose.yml",
	"service": "app",
	"workspaceFolder": "/workspace",

	// Set *default* container specific settings.json values on container create.
	"settings": {},

	// Add the IDs of extensions you want installed when the container is created.
	"extensions": [
		"dbaeumer.vscode-eslint",
		"mongodb.mongodb-vscode" 
	],

	// Use 'forwardPorts' to make a list of ports inside the container available locally.
	// "forwardPorts": [3000, 27017],

	// Use 'postCreateCommand' to run commands after the container is created.
	// "postCreateCommand": "yarn install",

	// Comment out connect as root instead. More info: https://aka.ms/vscode-remote/containers/non-root.
	"remoteUser": "node"
}

# docker-compose.yml
version: '3.8'

services:
  app:
    image: node:latest //已經使用dockerfile創建好的image
    volumes:
      - ..:/workspace:cached
    # Overrides default command so things don't shut down after the process ends.
    command: sleep infinity //持續運行不容container會停掉