如何改进我的 Docker 文件以完美地为 Angular 应用程序创建 Docker 图像？

Question

我很困惑如何为任何类型的 Node.js 或 Angular 应用程序创建 Dockerfile。我做了很多搜索来实现这一目标，但我做不到。我不明白下面的 Dockerfile 有什么问题。我该如何改进它？

FROM node:12.18-alpine as build

# set working directory
WORKDIR /usr/src
COPY src/ ./src/



# install and cache app dependencies
COPY package.json /app/package.json

RUN cd src/app && npm install @angular/cli && npm install && npm run build


# # start app
# CMD ng serve --host 0.0.0.0 --port 80 --disableHostCheck true

# generate build
RUN ng build --output-path=dist --configuration=production

############
### prod ###
############

# base image
FROM nginx:1.16.0-alpine

COPY ./nginx-config.conf /etc/nginx/conf.d/default.conf

# copy artifact build from the 'build environment'
COPY --from=build /app/dist /usr/share/nginx/html

# expose port 80
EXPOSE 80

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

nginx-config.conf:

server {
    listen 80 default_server;
    listen [::]:80 default_server;

    root /usr/share/nginx/html;

    index index.html;

    location / {
        try_files $uri $uri/ /index.html;
    }
}

在 Azure 管道中构建后出错：

Answer 1

how to improvew my Docker file to create an docker image for angular application perfectly?

我可以通过你的 dockerfile 重现这个问题。那是因为您将 WORKDIR 设置为 WORKDIR /usr/src 并将 package.json 复制到 /app/package.json。在这种情况下，文件package.json将被复制到WORKDIR，路径应该是：

/usr/src/app/package.json

但是，你在工作文件夹下使用命令RUN cd src/app，会切换到路径/usr/src/src/app。这与文件存在的路径不同 /usr/src/app.

因此，要解决此问题，您需要更改命令行：

COPY package.json /app/package.json

收件人：

COPY package.json ./src/app/package.json

作为测试，我使用 RUN cd src/app && ls 列出路径 /usr/src/src/app:

中的文件

如何改进我的 Docker 文件以完美地为 Angular 应用程序创建 Docker 图像？

How to improve my Dockerfile to create an Docker image for Angular application perfectly?

node.js

docker

devops

azure-devops

angular