Running NuxtJS in a Docker container

Guide how to create and run a Nuxt PWA project in a Docker container and how to share the project without Docker Hub

March 30, 2023


Nuxt is a free and open source JavaScript library based on Vue.js, Node.js, Webpack and Babel.js. Nuxt is inspired by Next.js, which is a framework of similar purpose, based on React.js.

Docker Container

Docker is a set of platform as a service (PaaS) products that use OS-level virtualization to deliver software in packages called containers. Docker is a tool that is used to automate the deployment of applications in lightweight containers so that applications can work efficiently in different environments.

Why I use Nuxt with Docker?

I’ve been running Nuxt projects with pm2, but Nuxt 3 doesn’t provide an easy way to run projects on different ports, so I’ve started using Docker to run multiple Nuxt projects on same server.

NGINX sends the request to the Docker container’s port, and the Docker container forwards the request to Nuxt’s default port.

Create a new Nuxt 3 app

To create a new starter project, open a terminal and enter the following command:

yarn create nuxt-app new-project
cd new-project

Install Docker

You must first install Docker on your local machine before you can create a container for the Nuxt application. Choose your operating system from the list below and follow the setup instructions:

How to dockerize a Nuxt 3 app without using the Docker Hub

Docker Hub offers only two private Docker containers and I don’t want to share the codes publicly, so I only use Docker containers on my own server.

I develop the Nuxt project locally on port 3000 and update the codes on GitHub from where I get the codes for the server. On the server, I build and run a Docker container with the Dockerfile file.

The only thing that needs to be changed for the Nuxt project is to create a Dockerfile file.

FROM node:lts as builder


COPY . .

RUN yarn install 

RUN yarn build

RUN rm -rf node_modules && 
  NODE_ENV=production yarn install 

FROM node:lts


COPY --from=builder /app  .


CMD [ "node", ".output/server/index.mjs" ]

Building and running the Docker container

docker build -t new-project .
docker run -it -p 3500:3000 new-project

The command tells Docker to run the container and forward the exposed port 3500 to port 3000 on your server. You can now use http://localhost:3500 to access your Nuxt app.

The following command displays the Docker containers that are currently running on your system:

docker ps -a

To stop your Docker container:

docker stop id

Thanks for reading!