2

I'm trying to build an Angular 15 project in Docker, but the build always hangs at the RUN npm run build step and never completes. This a fresh install ng new ng-sandbox-15 with the Dockerfile, .dockerignore, and nginx.conf copied from a working Angular 14 fresh install.

./Dockerfile

FROM node:16-alpine as builder

# Copy dependency definitions
COPY package.json package-lock.json ./

# disabling ssl for npm for Dev or if you are behind proxy
RUN npm set strict-ssl false

## installing and Storing node modules on a separate layer will prevent unnecessary npm installs at each build
RUN npm ci && mkdir /app && mv ./node_modules ./app

# Change directory so that our commands run inside this new directory
WORKDIR /app

# Get all the code needed to run the app
COPY . /app/

# Build the application
RUN npm run build


FROM nginx:1.17-alpine
## From 'builder' copy published folder
COPY --from=builder /app/dist /usr/share/nginx/html

COPY nginx/nginx.conf /etc/nginx/nginx.conf

# Expose the port the app runs in
EXPOSE 4000

CMD ["nginx", "-g", "daemon off;"]

./package.json:

{
  "name": "ng-sandbox-15",
  "version": "0.0.0",
  "scripts": {
    "ng": "ng",
    "start": "ng serve",
    "build": "ng build",
    "watch": "ng build --watch --configuration development",
    "test": "ng test"
  },
  "private": true,
  "dependencies": {
    "@angular/animations": "^15.2.0",
    "@angular/common": "^15.2.0",
    "@angular/compiler": "^15.2.0",
    "@angular/core": "^15.2.0",
    "@angular/forms": "^15.2.0",
    "@angular/platform-browser": "^15.2.0",
    "@angular/platform-browser-dynamic": "^15.2.0",
    "@angular/router": "^15.2.0",
    "rxjs": "~7.8.0",
    "tslib": "^2.3.0",
    "zone.js": "~0.12.0"
  },
  "devDependencies": {
    "@angular-devkit/build-angular": "^15.2.5",
    "@angular/cli": "~15.2.5",
    "@angular/compiler-cli": "^15.2.0",
    "@types/jasmine": "~4.3.0",
    "jasmine-core": "~4.5.0",
    "karma": "~6.4.0",
    "karma-chrome-launcher": "~3.1.0",
    "karma-coverage": "~2.2.0",
    "karma-jasmine": "~5.1.0",
    "karma-jasmine-html-reporter": "~2.0.0",
    "typescript": "~4.9.4"
  }
}

As seen in the image below, the Angular build completes successfully in 26.5 seconds, but the step is still stuck 20+ minutes later.

Docker stuck at RUN npm run build

The most similar problem I've seen is Docker build getting stuck at npm run build step, and I disagree with the only proposed answer CMD ["npm", "run", "build"] because that will not wait for the build to complete before trying to copy the built project into the nginx html directory.

Kevin Dufendach
  • 184
  • 1
  • 7

2 Answers2

1

I face the same issue when updated my angular 13 projects to 15.

I have 4 projects, 2 will build success and 2 will stuck after the RUN npm run build. After compare the projects I found out in my case is causing by the analytics inside the angular build.

Change the parameter in angular.json from

"cli": {
  "analytics": "XXXXXXXX-XXXX-XXXX-XXXX-XXXXXXXXX",
},

to

"cli": {
  "analytics": false,
},

This solution solved my issue. The root cause may be causing by upload the analytics data are blocked inside docker build

hnomka
  • 26
  • 1
  • 1
0

Can you check the copy path it should be ./ not . / in the docker file.

Also please look into the below code

  1. Installing and storing node modules on a separate layer will prevent unnecessary npm installs at each build:
RUN npm install && mkdir /app && mv ./node_modules ./app
  1. Change directory so that our commands run inside this new directory:
WORKDIR /app
  1. Get all the code needed to run the app
COPY ./ /app/
Tyler2P
  • 2,324
  • 26
  • 22
  • 31
Vignesh
  • 1,140
  • 1
  • 9
  • 17