Custom Development Environment

About 430 wordsAbout 1 min

Specifying Development Environment via Docker Image

You can specify the development environment image by writing a Workspaces event pipeline in .cnb.yml and setting pipeline.docker.image.

.cnb.yml
$:
  vscode:
    - docker:
        # Specify the development environment image, which can be any accessible image.
        # If the specified image has code-server installed, the development environment will start in single-container mode
        # If the specified image does not have code-server installed, the development environment will start in double-container mode
        # The following image is the CNB default development environment image with code-server installed, which will start in single-container mode
        # You can replace it with other images as needed
        image: cnbcool/default-dev-env:latest
      services:
        - vscode
        - docker
      # Tasks to execute after the development environment starts
      stages:
        - name: ls
          script: ls -al

Customizing Development Environment via Dockerfile

If specifying an image doesn't meet your needs, you can create a .ide/Dockerfile in the repository root to customize the development environment.

When no custom startup pipeline is defined, the system prioritizes using .ide/Dockerfile to build the base image. If .ide/Dockerfile doesn't exist or the build fails, it falls back to the default image.

# .ide/Dockerfile

# You can replace node with your required base image
FROM node:20

# Install code-server and common VSCode extensions
RUN curl -fsSL https://code-server.dev/install.sh | sh \
  && code-server --install-extension cnbcool.cnb-welcome \
  && code-server --install-extension redhat.vscode-yaml \
  && code-server --install-extension dbaeumer.vscode-eslint \
  && code-server --install-extension waderyan.gitblame \
  && code-server --install-extension mhutchie.git-graph \
  && code-server --install-extension donjayamanne.githistory \
  && code-server --install-extension tencent-cloud.coding-copilot \
  && echo done

# Install SSH service to support accessing the development environment via VSCode Remote-SSH (and other software as needed)
RUN apt-get update && apt-get install -y git wget unzip openssh-server

# Specify character set to support Chinese input in command line (choose character set as needed)
ENV LANG C.UTF-8
ENV LANGUAGE C.UTF-8

Customizing Both Development Environment and Startup Process

If you need to customize both the development environment and the startup process, you can write both .ide/Dockerfile and .cnb.yml. The Dockerfile content is the same as above.

In .cnb.yml, use build: .ide/Dockerfile to specify the custom build:

.cnb.yml
$:
  vscode:
    - docker:
        build: .ide/Dockerfile
        # You can also specify image as a fallback:
        # image: cnbcool/default-dev-env:latest
      services:
        - vscode
        - docker
      stages:
        - name: ls
          script: ls -al