Skip to main content

Dockerfile Template for Vue.js Framework

This guide helps you create suitable Dockerfile for Vue.js-based projects.

Key Points for All Dockerfiles​

  1. Use official Node.js images
  2. Create a non-root user for enhanced security
  3. Use environment variables for greater flexibility
  4. Optimize for each specific framework
FROM node:$node_version as build

ARG UID=1000
ARG GID=1000
RUN groupadd -g $GID -o app && \
useradd -g $GID -u $UID -mr -d /home/app -o -s /bin/bash app

USER app
WORKDIR /home/app
COPY --chown=app:app app/ /home/app/

RUN npm install
#CMD [ "npm", "run", "build" ] or CMD [ "npm", "run", "start" ]

FROM nginx:$nginx_version as production

COPY --from=build /home/app/dist/ /usr/share/nginx/html/

RUN echo 'server {\n\
listen 3000;\n\
server_name _;\n\
location / {\n\
root /usr/share/nginx/html;\n\
try_files $uri $uri/ /index.html;\n\
}\n\
location /index.html {\n\
root /usr/share/nginx/html;\n\
expires 0d;\n\
}\n\
}' > /etc/nginx/conf.d/default.conf
info
  • This Dockerfile uses a multi-stage structure: build stage and production stage.
  • In the build stage, we compile the Vue.js project.
  • In the production stage, the built files are transferred to an Nginx server.
  • The Nginx configuration is set up for the proper execution of the Vue.js application (SPA).
caution
  • Replace the $node_version variable with the desired Node.js version.
  • Replace the $nginx_version variable with the desired Nginx version.
  • Depending on the project needs, you can choose between npm run build and npm run start.

Building and Running the Dockerfile​

To build the Dockerfile and create an image, use the command:

docker build -t [ProjectName] .
  • -t: Assign a specific tag and name for the project

Then, to run it:

docker run -p outport:inport[3000] --name=container-name -d [ProjectName]
  • -p: Specify the port for running the project
  • outport: External port
  • inport: Internal port of the project specified in the Dockerfile
  • --name: Specify the container name
  • -d: Run the container in detached mode
caution
  1. Security: Always use the latest stable versions of Node.js and Nginx.
  2. Testing: Before deploying to production, make sure to test your Docker image in a production-like environment.