DockerFile — Multiple Stage build

How To Dockerize an Angular Application with multistage build

  • A multistage build allows you to use multiple images to build a final product.
  • In a multi-stage build, you have a single Dockerfile but can define multiple images inside it to help build the final image.
  • This approach to keeping Docker images small is using multistage builds

Let’s try to understand the multi-stage docker file that you can find in the below GitHub page.

Clone the sample angular code

You will see a DockerFile with the below content.

This Dockerfile has two stages.

Stage 1:

  • It will initialize a first build stage and this stage is named as build.
  • Angular build in a new layer on top of the base node image. After this instruction is executed, the build output is stored under usr/local/app/dist/my-angular-app

Stage 2:

  • Initializes a secondary build stage
  • Copies the build output generated in stage 1 (--from=build) to replace the default Nginx contents in this path -/usr/share/nginx/html.

Now, let’s build a docker image and run a container

Test the application