2

I am looking for a solution for correct docker file but when I write localhost:8080 on browser I can see nginx but I can not see default angular website on the browser. What can I do with my Docker file. What it is wrong ?


FROM node:12.8-alpine AS builder

WORKDIR /app
RUN npm install
COPY . .
RUN npm run build

# Step 2: Use build output from 'builder'
FROM nginx:stable-alpine
LABEL version="1.0"

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

WORKDIR /usr/share/nginx/html
COPY --from=builder . /app

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

enter image description here

Penguen
  • 16,836
  • 42
  • 130
  • 205
  • In addition to a correct Dockerfile, you need to properly run the container. If you want to access your service on `localhost:8080` from a browser running on your machine, you will need to [publish that port](https://docs.docker.com/config/containers/container-networking/#published-ports), which is something that happens at runtime. That's not something that gets baked into your Dockerfile. – larsks Jan 09 '21 at 18:54
  • Your final `COPY` line is copying to `/app` in the Nginx image, not the `WORKDIR` you set in the line previous. Did you mean to have the arguments in the opposite order, `COPY --from=builder /app .`? – David Maze Jan 09 '21 at 20:09

1 Answers1

3
  1. Right off the bat I see a couple things, like EXPOSE

First, in your Docker config you are missing the Expose option/line such as:

EXPOSE 4200

Insert it before your last RUN command in the docker file, to allow the port in the container (for e.g. port 4200) so the mapping from compose works (80:4200)

Its forwarding port 80 to 4200, essentially mapping your angular app.

  1. Update your config file: A good ref sample of sanitized docker config. You should compare your image with this to update your install with yarn, and copy to the correct output dir. etc.
FROM node:13.3.0 AS compile-image
// install
RUN npm install -g yarn

WORKDIR /opt/ng
COPY .npmrc package.json yarn.lock ./
RUN yarn install

ENV PATH="./node_modules/.bin:$PATH" 

# configure your expose port
#expose the port
   EXPOSE 4200
COPY . ./
RUN ng build --prod

FROM nginx
COPY docker/nginx/default.conf /etc/nginx/conf.d/default.conf
COPY --from=compile-image /opt/ng/dist/app-name /usr/share/nginx/html

  1. You may need to forward the port from the container to your system / host :

    docker run -p 4200:4200 test:latest

Transformer
  • 6,963
  • 2
  • 26
  • 52