如何在 nginx 的容器下部署 Angular 应用程序？

Question

I'm trying to deploy Angular app under docker Nginx. My config is next:

./Dockerfile

FROM node:12-alpine AS builder
ENV NODE_ENV production
WORKDIR /usr/src/app
COPY ["package.json", "yarn.lock", "./"]
RUN yarn install --production=false
COPY . .
RUN yarn build

FROM nginx:alpine
COPY --from=builder /usr/src/app/dist/angular-nginx/* /usr/share/nginx/html/
COPY ./nginx.conf /etc/nginx/conf.d/default.conf

./nginx.conf

server {
  listen 80;
  location / {
    root /usr/share/nginx/html;
    index index.html index.htm;
    try_files $uri $uri/ /index.html =404;
  }
} 

The app works, but its assets like images doesn't load (On development assets works).

And if I try to access directly to http://localhost:4000/assets/img/logo.png always go to http://localhost:4000/

What is my mistake?, thank you very much for the help.

Answer 1

the problem is probabably in this command

COPY --from=builder /usr/src/app/dist/angular-nginx/* /usr/share/nginx/html/

should be

COPY --from=builder /usr/src/app/dist/angular-nginx/ /usr/share/nginx/html/

with your variant you are copying just the first layer of the directory and just COPY dir/ should do the thing