How do I fix Docker getting stuck at "RUN npm run build" with Angular 15

Kevin Dufendach

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.

hnomka

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

Collected from the Internet

Please contact [email protected] to delete if infringement.

edited at
0

Comments

0 comments
Login to comment

Related

How to run `npm run build`

Angular app runs fine on my machine but after I build a Docker image it gives me "ERROR [node 6/6] RUN npm run build --prod" error

Do I need to run "npm run build" every time I made changes?

I get a buch of errors when i try to run the npm run build command

Component missing classes when I run 'npm run build', 'npm run start' but others can't reproduce the error

SQL Server : getting an error "Msg147, level15" Why do I get this error and how to fix it

TypeError trying to run npm run build

I'm getting an IndentationError. How do I fix it?

Why am I getting a JSON error and how do I fix it

how do i fix this? i'm not getting the right value for sarah

How do I fix the undefined result I keep getting from this?

why am I getting this error in AppleScript and how do I fix it

I am getting these errors and do not understand how to fix

Weblogic server getting StuckThreadMaxTime exception . How do I fix it?

How do I fix black lines in laptop LCD that are getting longer?

How do I fix the problem with objects getting overwrite?

How do I fix this Getting no reverse match error in django

keep getting the same error, how do I fix?

Dropbox install stuck at 99%, how do I fix it? (and any dpkg errors)

When installing an IPA on my test device, the app is stuck in "Waiting..." How do I fix this?

How to fix Android Studio getting stuck executing Gradle tasks?

How to prevent or fix Kubernetes pod getting stuck in containerCreating occasionally

How do I fix ln -s not working in Docker?

How do I fix a header on scroll using angular 8?

Angular only uses prod environment, how do I fix that

How do i fix "cant resolve" error in CSS for a Angular project?

RUN npm run build error when build dockerfile

I am getting an infinite loop when I run my program. How do I fix it?

How do I fix this error that I'm getting while making a POST request in nodejs