[Fixed] Failure while building angular app docker file in Azure devops

Issue

I am trying to build the below Docker file using Azure DevOps pipeline in a self hosted ubuntu agent. Could someone please guide to resolve this issue?

I have tried changing the npm install command to npm install -g [email protected] but then it fails in the RUN npm run build step.

The error that I am getting is as shown below

2021-04-20T17:29:23.6087494Z Step 1/19 : FROM node:alpine as builder
2021-04-20T17:29:23.6088225Z  ---> 75631da67663
2021-04-20T17:29:23.6088879Z Step 2/19 : WORKDIR '/app'
2021-04-20T17:29:23.6089516Z  ---> Using cache
2021-04-20T17:29:23.6090144Z  ---> 41ea0360723e
2021-04-20T17:29:23.6090654Z Step 3/19 : COPY ./package.json ./
2021-04-20T17:29:23.6091289Z  ---> Using cache
2021-04-20T17:29:23.6091915Z  ---> e2b12492d38d
2021-04-20T17:29:23.6092418Z Step 4/19 : RUN npm install
2021-04-20T17:29:23.6093071Z  ---> Running in ce397f7144a1
2021-04-20T17:29:26.7049157Z [91mnpm[0m[91m [0m[91mnotice[0m[91m 
2021-04-20T17:29:26.7061095Z [0m[91mnpm[0m[91m [0m[91mnotice[0m[91m New minor version of npm available! 7.7.6 -> 7.10.0
2021-04-20T17:29:26.7098941Z [0m[91mnpm[0m[91m [0m[91mnotice[0m[91m Run `npm install -g [email protected]` to update!
2021-04-20T17:29:26.7099797Z [0m[91mnpm[0m[91m [0m[91mnotice[0m[91m 
2021-04-20T17:29:26.7125430Z [0m[91mnpm[0m[91m [0m[91mERR![0m[91m [0m[91mcode[0m[91m ERESOLVE
2021-04-20T17:29:26.7178554Z [0m[91mnpm[0m[91m [0m[91mERR![0m[91m [0m[91mERESOLVE[0m[91m unable to resolve dependency tree
2021-04-20T17:29:23.6092418Z Step 4/19 : RUN npm install
2021-04-20T17:29:23.6093071Z  ---> Running in ce397f7144a1
2021-04-20T17:29:26.7049157Z [91mnpm[0m[91m [0m[91mnotice[0m[91m 
2021-04-20T17:29:26.7061095Z [0m[91mnpm[0m[91m [0m[91mnotice[0m[91m New minor version of npm available! 7.7.6 -> 7.10.0
2021-04-20T17:29:26.7097494Z [0m[91mnpm[0m[91m [0m[91mnotice[0m[91m Changelog: <https://github.com/npm/cli/releases/tag/v7.10.0>
2021-04-20T17:29:26.7098941Z [0m[91mnpm[0m[91m [0m[91mnotice[0m[91m Run `npm install -g [email protected]` to update!
2021-04-20T17:29:26.7099797Z [0m[91mnpm[0m[91m [0m[91mnotice[0m[91m 
2021-04-20T17:29:26.7125430Z [0m[91mnpm[0m[91m [0m[91mERR![0m[91m [0m[91mcode[0m[91m ERESOLVE
2021-04-20T17:29:26.7178554Z [0m[91mnpm[0m[91m [0m[91mERR![0m[91m [0m[91mERESOLVE[0m[91m unable to resolve dependency tree
2021-04-20T17:29:26.7188992Z [0m[91mnpm[0m[91m [0m[91mERR![0m[91m 
2021-04-20T17:29:26.7199171Z [0m[91mnpm[0m[91m [0m[91mERR![0m[91m While resolving: [email protected]
2021-04-20T17:29:26.7276600Z [0m[91mnpm[0m[91m [0m[91mERR![0m[91m Found: [email protected]
2021-04-20T17:29:26.7277932Z [0m[91mnpm[0m[91m [0m[91mERR![0m[91m node_modules/jasmine-core
2021-04-20T17:29:26.7278852Z [0m[91mnpm[0m[91m [0m[91mERR![0m[91m   dev [email protected]"~3.4.0" from the root project
2021-04-20T17:29:26.7279686Z [0m[91mnpm[0m[91m [0m[91mERR![0m[91m 
2021-04-20T17:29:26.7280546Z [0m[91mnpm[0m[91m [0m[91mERR![0m[91m Could not resolve dependency:
2021-04-20T17:29:26.7281506Z [0m[91mnpm[0m[91m [0m[91mERR![0m[91m peer [email protected]">=3.5" from [email protected]
2021-04-20T17:29:26.7282444Z [0m[91mnpm[0m[91m [0m[91mERR![0m[91m node_modules/karma-jasmine-html-reporter
2021-04-20T17:29:26.7283389Z [0m[91mnpm[0m[91m [0m[91mERR![0m[91m   dev [email protected]"^1.4.0" from the root project
2021-04-20T17:29:26.7284206Z [0m[91mnpm[0m[91m [0m[91mERR![0m[91m 
2021-04-20T17:29:26.7285237Z [0m[91mnpm[0m[91m [0m[91mERR![0m[91m Fix the upstream dependency conflict, or retry
2021-04-20T17:29:26.7286162Z [0m[91mnpm[0m[91m [0m[91mERR![0m[91m this command with --force, or --legacy-peer-deps
2021-04-20T17:29:26.7287135Z [0m[91mnpm[0m[91m [0m[91mERR![0m[91m to accept an incorrect (and potentially broken) dependency resolution.
2021-04-20T17:29:26.7287969Z [0m[91mnpm[0m[91m [0m[91mERR![0m[91m 
2021-04-20T17:29:26.7288925Z [0m[91mnpm[0m[91m [0m[91mERR![0m[91m See /root/.npm/eresolve-report.txt for a full report.
2021-04-20T17:29:26.7740346Z [0m[91m
2021-04-20T17:29:26.7754185Z [0m[91mnpm[0m[91m [0m[91mERR![0m[91m A complete log of this run can be found in:
2021-04-20T17:29:26.7766084Z [0m[91mnpm[0m[91m [0m[91mERR![0m[91m     /root/.npm/_logs/2021-04-20T17_29_26_725Z-debug.log
2021-04-20T17:29:27.3212293Z [0mThe command '/bin/sh -c npm install' returned a non-zero code: 1
2021-04-20T17:29:27.3263490Z ##[error]The command '/bin/sh -c npm install' returned a non-zero code: 1
2021-04-20T17:29:27.3320640Z ##[error]The process '/usr/bin/docker' failed with exit code 1
2021-04-20T17:29:27.3389602Z ##[section]Finishing: Docker

docker file

FROM node:alpine as builder
WORKDIR '/app'
COPY ./package.json ./
RUN npm install
COPY . .
RUN npm run build

FROM nginx
EXPOSE 4200
COPY ./nginx/default.conf /etc/nginx/conf.d/default.conf
COPY --from=builder /app/dist /usr/share/nginx/html

package.json is as given below.

{
  "name": "contacts-app",
  "version": "0.0.0",
  "scripts": {
    "ng": "ng",
    "start": "ng serve",
    "build": "ng build",
    "build:prod": "ng build --prod",
    "test": "ng test",
    "lint": "ng lint",
    "e2e": "ng e2e"
  },
  "private": true,
  "dependencies": {
    "@angular/animations": "~8.2.13",
    "@angular/cdk": "~8.2.3",
    "@angular/common": "~8.2.13",
    "@angular/compiler": "~8.2.13",
    "@angular/core": "~8.2.13",
    "@angular/forms": "~8.2.13",
    "@angular/material": "^8.2.3",
    "@angular/platform-browser": "~8.2.13",
    "@angular/platform-browser-dynamic": "~8.2.13",
    "@angular/router": "~8.2.13",
    "hammerjs": "^2.0.8",
    "rxjs": "~6.4.0",
    "tslib": "^1.10.0",
    "zone.js": "~0.9.1"
  },
  "devDependencies": {
    "@angular-devkit/build-angular": "~0.803.18",
    "@angular/cli": "~8.3.18",
    "@angular/compiler-cli": "~8.2.13",
    "@angular/language-service": "~8.2.13",
    "@types/node": "~8.9.4",
    "@types/jasmine": "~3.3.8",
    "@types/jasminewd2": "~2.0.3",
    "codelyzer": "^5.0.0",
    "jasmine-core": "~3.4.0",
    "jasmine-spec-reporter": "~4.2.1",
    "karma": "~4.1.0",
    "karma-chrome-launcher": "~2.2.0",
    "karma-coverage-istanbul-reporter": "~2.0.1",
    "karma-jasmine": "~2.0.1",
    "karma-jasmine-html-reporter": "^1.4.0",
    "protractor": "~5.4.0",
    "ts-node": "~7.0.0",
    "tslint": "~5.15.0",
    "typescript": "~3.5.3"
  }
}

Solution

According to your error message, [email protected] requires [email protected] and higher versions, but in your package.json, you are using [email protected].

You can downgrade your karma-jasmine-html-reporter version to 1.4.2 or upgrade your jasmine-core version to 3.5.0. Just be careful not to cause new conflicts with your application.

Leave a Reply

(*) Required, Your email will not be published