Stage 1: Build Application
This stage is responsible for building the web application.
FROM node:20-slim as build
: This sets the base image to Node.js 20-slim and names this stage as "build". It's used for building the application.
ARG VITE_SOURCEMAP='false'
: Defines an argument VITE_SOURCEMAP
with a default value of 'false'.
ENV PNPM_HOME="/pnpm"
and ENV PATH="$PNPM_HOME:$PATH"
: Set environment variables for the PNPM package manager.
RUN corepack enable
: Enables the Corepack package manager.
COPY . /gaia_ui_build
: Copies the contents of the current directory into a directory called /gaia_ui_build
inside the image.
WORKDIR /gaia_ui_build
: Sets the working directory to /gaia_ui_build
.
RUN npm install -g npm
: Updates npm to the latest version.
RUN npm install -g pnpm --force
: Installs the PNPM package manager.
RUN --mount=type=cache,id=pnpm,target=/pnpm/store pnpm install
: Uses a cache to install project dependencies using PNPM.
RUN pnpm run build
: Runs a build script to build the web application.
This stage prepares the application for production deployment using Nginx.
FROM nginx:alpine as GaiaUI
: Sets the base image to Nginx Alpine Linux and names this stage as "GaiaUI".
ARG PORT=8080:
Declares a build argument PORT
with a default value of 8080
. This sets the port for the Nginx server.ENV PORT=$PORT:
Sets an environment variable PORT
equal to the build argument PORT
. This is used to configure Nginx to listen on the specified port.ARG API_URL=http://localhost:8085:
Introduces another build argument API_URL
with a default of http://localhost:8085
. ENV API_URL=$API_URL:
Sets an environment variable API_URL
equal to the build argument API_URL
.RUN apk add --no-cache bash perl
: Installs Bash and PERL in the Nginx image.
USER root:root
: Sets the user to root.
WORKDIR /gaia_ui
: Sets the working directory to /gaia_ui
.
COPY --from=build /gaia_ui_build/gaia_ui_prescript.sh /docker-entrypoint.d/gaia_ui_prescript.sh
: Copies a prescript from the build stage to the /docker-entrypoint.d/
directory. This script may replace environment variables in files.
COPY --from=build /gaia_ui_build/ngnix.conf ./template/ngnix.conf.tpl
: Copies an NGINX configuration template file.
COPY --from=build /gaia_ui_build/dist /usr/share/nginx/html
: Copies the built application from the build stage to the NGINX HTML folder.
Copies template config files:
COPY --from=build /gaia_ui_build/dist/assets/config.js ./template/config.js.tpl
COPY --from=build /gaia_ui_build/dist/assets/config.development.js ./template/config.development.js.tpl
COPY --from=build /gaia_ui_build/.gaia-ui-version .gaia-ui-version
: Copies the application version for reference.
RUN chmod +x /docker-entrypoint.d/gaia_ui_prescript.sh
: Makes the prescript executable.
EXPOSE 80
: Exposes port 80 for incoming HTTP traffic.
CMD ["nginx", "-g", "daemon off;"]
: Sets the command to start Nginx when the container is run.
Building a Docker image from this Dockerfile involves using the docker build
command. You can customize the build process by specifying various arguments, allowing for different configurations of the resulting image.
Bare Minimum Build: To build the Docker image with the default settings (as specified in the Dockerfile), navigate to the directory containing the Dockerfile and run:
docker build -t my-gaia-ui .
-t my-gaia-ui
assigns the tag my-gaia-ui
to the built image..
specifies the current directory as the build context.Available Arguments: The Dockerfile includes several build-time arguments (ARG
) that allow for customizing the build. Here is a list of the available arguments and their default values:
true
.dark
. Options [dark, light
]To build with sourcemaps:
docker build --build-arg VITE_SOURCEMAP='true' -t your-image-name .
to build with a light theme as default:
docker build --build-arg THEME_MODE=light -t your-image-name .
--build-arg
flag allows you to override the default argument value specified in the Dockerfile.Important
If you have a Docker Desktop or Docker Engine version below 23.0, you need to enable the "Docker Buildkit" in order to build these images, otherwise, the build process will fail.
Here you can see how to enable or configure it by default.
After building the Docker image from the Dockerfile, you can run a container using the docker run command. This section provides instructions on how to do so, including how to utilize various environment variables for customizing the runtime behavior of your container.
$ docker run -d --name gaia-ui-container -p 8080:8800 myimage
Bare Minimum Run: To run a container with the default settings, use the following command:
docker run -d -p 8080:8080 --name gaia-ui-container
-d
runs the container in detached mode (in the background).-p 8080:80
maps port 8080 of the container to port 8080 on the host. Adjust the port numbers as needed based on the PORT
environment variable.--name gaia-ui-container
is the tag name of the image you built.Available Environment Variables: The Dockerfile defines several environment variables (ENV
) that you can override at runtime. Here is a list of the available environment variables:
THEME_MODE,PORT,API_URL
: Various settings for the GAIA UI.To run with a custom port:
docker run -d -p 8080:9090 -e PORT=9090 --name gaia-ui-container
To run with a custom API URL:
docker run -d -p 8080:8080 -e API_URL='http://api.example.com' --name gaia-ui-container
To run with specific theme:
docker run -d -p 8080:8080 -e THEME_MODE='light' --name gaia-ui-container
-e
flag is used to set environment variables in the container. These variables can override the defaults set in the Dockerfile.-p
) align with the PORT
environment variable.Below is a table listing all the environment variables used in the Dockerfile, along with their default values and descriptions.
Name | Default | Description |
---|---|---|
VITE_SOURCEMAP | 'false' | Determines if Vite will add sourcemaps to the build, aiding in debugging. Applicable only on the build stage |
THEME_MODE | 'dark' | Defines the theme mode for the UI. |
PNPM_HOME | "/pnpm" | Specifies the home directory for PNPM. Applicable only on the build stage |
PORT | 8080 | Sets the port for serving the application, used in the Nginx configuration. |
API_URL | http://localhost:8085 | Sets the URL of the GAIA API to be called from the GAIA UI. |
To change the base image to another Node base image, follow these steps:
Locate the FROM
Directive: In your Dockerfile, look for the FROM
directive. This directive specifies the base image and its version.
FROM node:20-slim as build
In this example, the base image is node:20-slim
.
Choose a New Node.js Version:
Decide on the Node.js version you want to use. You can find the available official Node.js images on Docker Hub. Choose a version that is compatible with your application's requirements.
Modify the FROM
Directive:
Replace the existing Node.js version in the FROM
directive with the version you want to use. For example, if you want to use Node.js version 14, update it as follows:
FROM node:21-alpine3.18 as build
If you need a more specific version, you can use the full version tag, such as node:21-alpine3.18
Rebuild the Docker Image:
Build the Docker image again with the updated Dockerfile. This will use the new base image for the ui.
docker build -t my-gaia-ui .
Replace my-gaia-ui
with a suitable name for your Docker image.
Same process can be done to replace the nginx image