Answer a question

I found many answers online to the exception Cannot find module '@angular-devkit/build-angular/package.json, among which adding @angular-devkit/build-angular@0.1102.9 --force , but none worked in my case.

Problem

Running an Angular application using docker-compose: after building the application, the error below occurs when running docker-compose up; note, the app compiles successfully when running docker run <image>, but I need it to work with Docker Compose.

defuse-ui         | An unhandled exception occurred: Cannot find module '@angular-devkit/build-angular/package.json'
defuse-ui         | Require stack:
defuse-ui         | - /usr/local/lib/node_modules/@angular/cli/node_modules/@angular-devkit/architect/node/node-modules-architect-host.js
defuse-ui         | - /usr/local/lib/node_modules/@angular/cli/node_modules/@angular-devkit/architect/node/index.js
defuse-ui         | - /usr/local/lib/node_modules/@angular/cli/models/architect-command.js
defuse-ui         | - /usr/local/lib/node_modules/@angular/cli/commands/serve-impl.js
defuse-ui         | - /usr/local/lib/node_modules/@angular/cli/node_modules/@angular-devkit/schematics/tools/export-ref.js
defuse-ui         | - /usr/local/lib/node_modules/@angular/cli/node_modules/@angular-devkit/schematics/tools/index.js
defuse-ui         | - /usr/local/lib/node_modules/@angular/cli/utilities/json-schema.js
defuse-ui         | - /usr/local/lib/node_modules/@angular/cli/models/command-runner.js
defuse-ui         | - /usr/local/lib/node_modules/@angular/cli/lib/cli/index.js
defuse-ui         | - /usr/local/lib/node_modules/@angular/cli/lib/init.js
defuse-ui         | - /usr/local/lib/node_modules/@angular/cli/bin/ng
defuse-ui         | See "/tmp/ng-nVUdCb/angular-errors.log" for further details.
defuse-ui exited with code 127

Dockerfile

FROM node:14.16.1

WORKDIR /app

ENV PATH /app/node_modules/.bin:$PATH

COPY package.json /app/package.json

RUN npm install -g @angular/cli@11.2.9 @angular-devkit/build-angular@0.1102.9 --force
RUN npm install

COPY . /app

CMD ng serve --host 0.0.0.0 --port 4200

package.json, package-lock.json and other files are accessible at https://github.com/radon-h2020/radon-defuse/tree/905d7a339a31bc68dbd9b7a5258b5e9b19e65c68 release 1.0.0

Versions:

• Docker version 20.10.17, build 100c701
• docker-compose version 1.29.2, build unknown

Answers

After days of trials, I finally found a solution on this useful webpage. The docker-compose.yml has to be updated with a new volume pointing to the node_modules:

services:
  defuse-ui:
    build: ./defuse
    container_name: defuse-ui
    ports:
      - 4200:4200
    expose:
      - 4200
    volumes:
      - /app/node_modules  # <-- Add this
      - ./defuse:/app # <!-- or remove this

A possible explanation, as described in the webpage is that

when docker builds the image, the node_modules directory is created within the worker directory, and all the dependencies are installed there. Then on runtime the working directory from outside docker is mounted into the docker instance (which does not have the installed node_modules), hiding the node_modules you just installed. A workaround is to use a data volume to store all the node_modules, as data volumes copy in the data from the built docker image before the worker directory is mounted