October 30, 2025

Dockerizing a Legacy Vue App

Earlier this week I mentioned about implementing a Docker solution so I could run a legacy Vue app that requires Node v12 on a newer Mac that does not support v12 out of the box. My ultimate goal was to have Node and all dependencies managed inside the container while still allowing developers to work on the code from their host machine.

Version 1: Proof of concept with a Dockerfile

The first iteration of this I had a simple Dockerfile that would spin up a new container:

• Used debian based OS
• Install required OS dependencies
• Installed Node v12
• Copied host files into the container
• Installed npm dependencies
• Expose port 8080.

Awesome — we have a working environment ✅

The problem. This required developers to run several cryptic commands to get rolling; build the image, run containers, making sure the ports were mapped, volumes mounted, etc. etc. Not ideal. I wanted this solution to require the least amount of steps.

Version 2: Docker Hub + docker-compose.yml

I moved my image to Docker Hub and replaced the Dockerfile with a minimal docker-compose.yml. So now the only step a developer needs to perform is run one simple command:

docker-compose up

This command will handle everything:

• Pulls my image from Docker Hub
• Maps their host port 8080 to the container
• Mounts the host project directory to the container’s app directory
• Installs Node dependencies (if they're missing)
• Starts the Webpack dev server automatically
• Creates a node_modules volume so dependencies live in the container

# docker-compose.yml
services:
  vueapp:
    image: <username>/vue:bullseye-node12
    container_name: vue-node-12
    working_dir: /app
    volumes:
      - .:/app
      - node_modules:/app/node_modules
    ports:
      - "8080:8080"
    command: >
      bash -c "
        if [ ! -d node_modules ]; then
          echo '🧱 Installing dependencies...';
          npm install;
        fi &&
        echo '🚀 Starting Webpack dev server...';
        npm run serve
      "
volumes:
  node_modules:

Much better developer experience 🤘