Issue while Dockerizing angular application

Question

I am very new to docker and angular , i am getting error index.html generation failed while builidng docker image can anyone help me how to resolve index.html generation failed error or correct me if there are any errors in my dockerfile.

Docker file

 FROM node:latest AS builder
 WORKDIR /csswebdockerimage
 COPY . .
 RUN npm i
 RUN npm run build --prod

 FROM nginx:alpine
 COPY --from=builder /csswebdockerimage/dist/cssweb-demo1/ /usr/share/nginx/html
 # EXPOSE 80
 # CMD ["nginx","-g"]

package.json

{
   "name": "cssweb-demo",
     "version": "0.0.0",
       "scripts": {
    "ng": "ng",
    "start": "ng serve  --poll=2000 --proxy-config proxy.config.json ",
    "build": "ng build",
     "watch": "ng build --watch --configuration development",
      "test": "ng test"
       },
     "private": true,
      "dependencies": {
    "@angular/animations": "~12.0.4",
   "@angular/cdk": "^12.0.4",
   "@angular/common": "~12.0.4",
   "@angular/compiler": "~12.0.4",
   "@angular/core": "~12.0.4",
   "@angular/forms": "~12.0.4",
   "@angular/material": "^12.0.4",
  "@angular/platform-browser": "~12.0.4",
   "@angular/platform-browser-dynamic": "~12.0.4",
   "@angular/router": "~12.0.4",
   "@ngtools/webpack": "^12.1.0",
   "angular-material": "^1.2.2",
   "rxjs": "~6.6.0",
   "tslib": "^2.1.0",
   "zone.js": "~0.11.4"
    },
  "devDependencies": {
   "@angular-devkit/build-angular": "~12.0.4",
   "@angular/cli": "~12.0.4",
   "@angular/compiler-cli": "~12.0.4",
   "@types/jasmine": "~3.6.0",
   "@types/node": "^12.11.1",
  "jasmine-core": "~3.7.0",
   "karma": "~6.3.0",
  "karma-chrome-launcher": "~3.1.0",
  "karma-coverage": "~2.0.3",
  "karma-jasmine": "~4.0.0",
   "karma-jasmine-html-reporter": "^1.5.0",
  "typescript": "~4.2.3"
   }
   }

exe · Answer 1 · 2021-09-22T11:00:47.177

-1

Can you try to copy package.json first and install all packages before copy all files from current directory, like this

Dockerfile

FROM node:12.7-alpine AS builder
WORKDIR /csswebdockerimage
COPY package.json ./
RUN npm cache clean --force
RUN npm i
COPY . .
RUN node_modules/.bin/ng build --prod --aot --build-optimizer --vendor-chunk=true


FROM nginx:1.19.0-alpine
VOLUME /var/cache/nginx
COPY --from=builder /csswebdockerimage/dist/cssweb-demo1/ /usr/share/nginx/html
COPY ./.config/.nginx/nginx.conf /etc/nginx/conf.d/default.conf
EXPOSE 80

edited Sep 22 '21 at 11:00

answered Sep 22 '21 at 06:09

exe

19
1
6

its still showing me same error – sai krishna reddy Sep 22 '21 at 10:37
try to use node node:12.7-alpine – exe Sep 22 '21 at 11:00

score -1 · Accepted Answer · answered Sep 22 '21 at 06:38

-1

Don't know if this resolves the issue, but here is how I dockerize Angular

FROM node:12-alpine
LABEL Author="okira-e"

COPY package*.json ./
RUN npm install -g @angular/cli
RUN npm install

RUN mkdir src
WORKDIR /src

COPY . .

EXPOSE 4200

answered Sep 22 '21 at 06:38

Okira

52
1
8

Your answer could be improved with additional supporting information. Please [edit] to add further details, such as citations or documentation, so that others can confirm that your answer is correct. You can find more information on how to write good answers [in the help center](/help/how-to-ask). – Community Sep 22 '21 at 06:41
I tried , getting few new errors – sai krishna reddy Sep 22 '21 at 10:38
1

thanks, for atleast commenting ur inputs im accepting – sai krishna reddy Oct 11 '21 at 11:51

Issue while Dockerizing angular application

Docker file

package.json

2 Answers2