How can I exclude @angular/cli from npm-install process in a Docker image creation process?

Question

I'm starting a project that will use Angular.js and Node.js and it will be inside a Docker container. In my Dockerfile I've indicate that Docker must RUN npm install to configure my project when it will build the Docker image. This is a part of build logs:

Step 4/10 : RUN npm install
---> Running in 90d567c905d4

> @angular/cli@6.0.3 postinstall /usr/src/app/node_modules/@angular/cli
> node ./bin/ng-update-message.js

npm WARN optional SKIPPING OPTIONAL DEPENDENCY: fsevents@1.2.4 (node_modules/fsevents):
npm WARN notsup SKIPPING OPTIONAL DEPENDENCY: Unsupported platform for fsevents@1.2.4: wanted {"os":"darwin","arch":"any"} (current: {"os":"linux","arch":"x64"})    

added 295 packages in 12.979s

I have installed @angular/cli package with npm in my OS and I don't want that the package @angular/cli will be installed in my project when Docker RUN npm install , it makes heavier my Docker image.

How can I exclude @angular/cli from npm-install process in a Docker image creation process?

To solve that I'm using this code in my Dockerfile :

RUN npm uninstall @angular/cli

But it didn't solve my problem. What you can suggest me?

Answer 1

One of the comments talks about running ng-build and then using the dist folder in your Dockerfile. This is a step you can easily automate in your build

This is the perfect opportunity to make use of Docker's multi-stage builds .

You're going to want your Dockerfile to look something like this:

FROM node:7.9 as build

WORKDIR /app
COPY package.json /app
RUN npm install
COPY . /app/      # or wherever your source code is found
RUN ng-build

Here is the multi-stage part:

FROM nginx:alpine  # or whatever image you want here
COPY --from=build /app/dist/ /usr/share/nginx/html/

Now you have a nice, small image, with only your dist directory, and none of the unnecessary overhead from running ng-build and npm-install in your final container.