Git clone into a specific directory is not working as expected

[kishan02patel]

Hi Everyone,

I am playing around with the default javascript-node dev container image and was trying to extend its features and customisations according to my local setup. I am using ghcr.io/devcontainers/features/common-utils feature which already has oh-my-zsh installed and I want to install powerlevel10k theme, zsh-autosuggestions and fast-syntax-highlighting. However, all these things are being installed at /root/.oh-my-zsh instead of /home/node/.oh-my-zsh. I have tried switching the user to node in Dockerfile but no luck. I have also tried to set working directory but that also doesn't work. I have specified the path to git clone command and that is also not working. I have tried and used the same Dockerfile to create Docker image and it seems to work. Not sure what I am doing wrong. Any help is appreciated!

Here is my Dockerfile:

FROM mcr.microsoft.com/devcontainers/javascript-node:1-20-bullseye

# Since we have "ghcr.io/devcontainers/features/common-utils:2" feature installed it will install zsh and oh-my-zsh.
RUN apt-get update && export DEBIAN_FRONTEND=noninteractive \
  && apt-get -y install --no-install-recommends bat tmux

# Setting User does not work
# USER node

# Setting working directory also does not work
# WORKDIR /home/node

# Install Powerlevel10k theme
RUN git clone --depth=1 https://github.com/romkatv/powerlevel10k.git /home/node/.oh-my-zsh/custom/themes/powerlevel10k
# RUN git clone --depth=1 https://github.com/romkatv/powerlevel10k.git ${ZSH_CUSTOM:-$HOME/.oh-my-zsh/custom}/themes/powerlevel10k

# Install fast zsh syntax highlighting plugin
RUN git clone https://github.com/zdharma-continuum/fast-syntax-highlighting.git /home/node/.oh-my-zsh/custom/plugins/fast-syntax-highlighting
# RUN git clone https://github.com/zdharma-continuum/fast-syntax-highlighting.git ${ZSH_CUSTOM:-$HOME/.oh-my-zsh/custom}/plugins/fast-syntax-highlighting

# Install zsh autocomplete plugin
RUN git clone https://github.com/zsh-users/zsh-autosuggestions /home/node/.oh-my-zsh/custom/plugins/zsh-autosuggestions
# RUN git clone https://github.com/zsh-users/zsh-autosuggestions ${ZSH_CUSTOM:-$HOME/.oh-my-zsh/custom}/plugins/zsh-autosuggestions

Here is .devcontainer.json file:

{
  "name": "Node.js",
  "build": {
    "dockerfile": "Dockerfile"
  },
  "features": {
    "ghcr.io/devcontainers/features/common-utils:2": {
      "configureZshAsDefaultShell": true
    }
  },
  "forwardPorts": [3000],
  "postCreateCommand": {
    "copyFiles": "cp .devcontainer/.zshrc $HOME && cp .devcontainer/.p10k.zsh $HOME && cp .devcontainer/.tmux.conf $HOME",
    "copyFonts": "sudo cp -a .devcontainer/fonts/. /usr/local/share/fonts/ && fc-cache -f -v",
    "updatePermissionsAndInstall": "sudo chown node node_modules && npm install"
  },
  "postStartCommand": "nohup bash -c 'npm run dev &'",
  "customizations": {
    "vscode": {
      "extensions": [
        "mutantdino.resourcemonitor",
        "dbaeumer.vscode-eslint",
        "esbenp.prettier-vscode",
        "oderwat.indent-rainbow",
        "dotenv.dotenv-vscode"
      ],
      "settings": {
        "terminal.integrated.fontFamily": "MesloLGS NF"
      }
    }
  },
  "mounts": [
    {
      "source": "${localWorkspaceFolderBasename}-node_modules",
      "target": "${containerWorkspaceFolder}/node_modules",
      "type": "volume"
    },
    {
      "source": "${localWorkspaceFolderBasename}-.devcontainer-.zsh_history",
      "target": "/home/node",
      "type": "volume"
    }
  ],
  "workspaceMount": "source=${localWorkspaceFolder},target=/opt/${localWorkspaceFolderBasename},type=bind",
  "workspaceFolder": "/opt/${localWorkspaceFolderBasename}",
  "runArgs": ["--env-file", ".env"]
}

[samruddhikhandale]

Hi 👋

Interesting, I tried to create a dev container with the provided dev container config, and I do see plugins installed in /home/node/.oh-my-zsh

However, all these things are being installed at /root/.oh-my-zsh instead of /home/node/.oh-my-zsh

Okay, I do see it added to /root/.oh-my-zsh folder as well, but that's because of https://github.com/devcontainers/features/blob/d53b9d1816bac7a62f9ba5f20723eef428042d1f/src/common-utils/main.sh#L519-L525 where it tries to sync oh-my-zsh configuration of user with root.

As the javascript-image, already installs common-utils Feature with installOhMyZsh:true, @kishan02patel you can avoid the issue with updating your features property to 👇

  "features": {
    "ghcr.io/devcontainers/features/common-utils:2": {
      "configureZshAsDefaultShell": true,
      "installOhMyZsh": false
    }
  }
  

You can see that it worked in here 👇

[kishan02patel]

Thanks @samruddhikhandale

I created a new repo and retraced my steps and it works. Turns out the issue was due to this:

{
"source": "${localWorkspaceFolderBasename}-.devcontainer-.zsh_history",
"target": "/home/node",
"type": "volume"
}

What would be the best way to keep the zsh_history file? I have already seen the video on the VS Code channel and that works but just wondering if there is a way to use just use the .zsh_history file in default location /home/node and not mount a folder.

[samruddhikhandale]

Nice!

What would be the best way to keep the zsh_history file? I have already seen the video on the VS Code channel and that works but just wondering if there is a way to use just use the .zsh_history file in default location /home/node and not mount a folder.

Unfortunately, I am not familiar with any other way. That's how I have been using as well. (eg. https://github.com/devcontainers/cli/blob/main/.devcontainer/devcontainer.json#L15)