Nuxt•3w ago

Nuxt app to production using docker

Hey guys, I am trying to deploy my nuxt app to production using docker. I have already found countless articles about that topic but they dont actually deploy to production but rather the development version. I tried coming up with my own solution but I am unsure if this is actually correct or if this introduces a few security concerns:

ARG NODE_VERSION=22.11.0

# Create build stage
FROM node:${NODE_VERSION}-slim AS build

# Set the working directory inside the container
WORKDIR /app

# Installing dependencies
COPY yarn.lock package.json ./
RUN yarn install

# Copying remaining contents
COPY . .

EXPOSE 3000

#CMD ["yarn", "build", "--host", "0.0.0.0"]
RUN yarn build
CMD ["node", ".output/server/index.mjs"]

ARG NODE_VERSION=22.11.0

# Create build stage
FROM node:${NODE_VERSION}-slim AS build

# Set the working directory inside the container
WORKDIR /app

# Installing dependencies
COPY yarn.lock package.json ./
RUN yarn install

# Copying remaining contents
COPY . .

EXPOSE 3000

#CMD ["yarn", "build", "--host", "0.0.0.0"]
RUN yarn build
CMD ["node", ".output/server/index.mjs"]

I would really appreciate any sort of feedback and issues you guys might see with my Dockerfile Articles: - https://mokkapps.de/blog/dockerizing-a-nuxt-app - https://nuxt.com/docs/getting-started/deployment - https://shipyard.build/blog/how-to-yarn-project-with-docker/

2 Replies

kapa.ai•3w ago

Hi @SovietChicken. I'm kapa.ai, your friendly support bot. I will try to answer your question by searching through the knowledge base. :wave: ---------------------- Thank you for your question about deploying a Nuxt app to production using Docker. I'll provide some feedback on your Dockerfile and suggest some improvements based on the knowledge sources available. Your Dockerfile is on the right track, but there are a few adjustments we can make to improve it for a production deployment: 1. Multi-stage build: It's a good practice to use a multi-stage build to reduce the final image size. This separates the build stage from the runtime stage. 2. Use a non-root user: For security reasons, it's better to run the application as a non-root user. 3. Copy only necessary files: To optimize the build process, copy only the files needed for the build. Here's an improved version of your Dockerfile based on the knowledge sources:

FROM node:lts-alpine as build

WORKDIR /app

# Copy package.json and yarn.lock
COPY package.json yarn.lock ./

# Install dependencies
RUN yarn install

# Copy the rest of the application code
COPY . .

# Build the Nuxt application
RUN yarn build

FROM node:lts-alpine as production

WORKDIR /app

# Create a non-root user
RUN addgroup --system --gid 1001 nodejs
RUN adduser --system --uid 1001 nuxtjs

# Copy the built application from the build stage
COPY --from=build /app/.output .

# Set the user to run the application
USER nuxtjs

# Expose the port the app runs on
EXPOSE 3000

# Set host to listen on all interfaces
ENV HOST=0.0.0.0

# Start the application
CMD ["node", "server/index.mjs"]

FROM node:lts-alpine as build

WORKDIR /app

# Copy package.json and yarn.lock
COPY package.json yarn.lock ./

# Install dependencies
RUN yarn install

# Copy the rest of the application code
COPY . .

# Build the Nuxt application
RUN yarn build

FROM node:lts-alpine as production

WORKDIR /app

# Create a non-root user
RUN addgroup --system --gid 1001 nodejs
RUN adduser --system --uid 1001 nuxtjs

# Copy the built application from the build stage
COPY --from=build /app/.output .

# Set the user to run the application
USER nuxtjs

# Expose the port the app runs on
EXPOSE 3000

# Set host to listen on all interfaces
ENV HOST=0.0.0.0

# Start the application
CMD ["node", "server/index.mjs"]

This Dockerfile incorporates best practices for deploying a Nuxt application to production using Docker. Here are some key points: 1. We use a multi-stage build to keep the final image size smaller. 2. The application is built in the first stage, and only the necessary output is copied to the production stage. 3. We create a non-root user (nuxtjs) for running the application, which is a security best practice. 4. The HOST environment variable is set to 0.0.0.0 to ensure the application listens on all network interfaces, which is important for containerized environments Stack Overflow (https://stackoverflow.com/questions/77046323). Additionally, make sure to create a .dockerignore file in your project root with the following content to exclude unnecessary files from the Docker build context Nitro Docs (https://nitro.unjs.io/deploy/providers/koyeb#using-a-docker-container):

Dockerfile
.dockerignore
node_modules
npm-debug.log
.nitro
.output
.git
dist
README.md

Dockerfile
.dockerignore
node_modules
npm-debug.log
.nitro
.output
.git
dist
README.md

When building your Docker image, make sure to run the build command from your project root:

docker build -t your-nuxt-app .

docker build -t your-nuxt-app .

To run the container:

docker run -p 3000:3000 your-nuxt-app

docker run -p 3000:3000 your-nuxt-app

This setup should provide a more secure and optimized way to deploy your Nuxt application to production using Docker. Remember to adjust any environment variables or configuration settings specific to your application as needed. ---------------------- Note: you can ask me a follow up question by @ mentioning me again :speech_balloon: ----------------------

kapa.ai•3w ago

<@1136389571685400706> Kapa.ai is still learning and improving, please let me know how I did by reacting below.

Gaming

Programming

Nuxt app to production using docker