通过从 github 获取代码对 angular 应用程序进行 docker 化时遇到一些问题

Getting some issues while dockerizing an angular application by fetching the code from github

如果有人可以帮助我使用此 docker 文件和 kubernetes conf 文件来执行以下任务,我将不胜感激。 我想创建一个 Docker 文件,它可以从 github 获取 angular 应用程序的源代码并构建它,并将其推送到 docker 中心。 我已尝试使用下面的 Docker 文件,但该文件存在问题。如果有人可以指导我解决我所犯的错误,或者可以提供合适的 Docker 文件,那就太好了。 另外,如果可能的话,我还想请求 kubernetes conf 文件,它可以从 dockerhub 和 运行 中提取图像作为服务。 谢谢。

存储库中已有一个可用的 Dockerfile,您可以使用。您可以只克隆存储库并构建它。

如果你不能这样做并且想从 Dockerfile 中克隆 repo,你可以像这样修改它

### STAGE 1: Build ###
FROM node:12.7-alpine AS build
RUN apk update && apk add git
RUN git clone https://github.com/wkrzywiec/aston-villa-app.git
WORKDIR /aston-villa-app
RUN npm install
RUN npm run build --prod

### STAGE 2: Run ###
FROM nginx:1.17.1-alpine
COPY --from=build /aston-villa-app/dist/aston-villa-app /usr/share/nginx/html

使用

构建并运行
docker build -t aston .
docker run -d -p 5000:80 aston

然后在浏览器中访问 http://localhost:5000/。

至于在 AWS/Kubernetes 上达到 运行,我建议为此提出一个新问题。你应该在 Whosebug 中只有一个问题 post.

假设您已经 Docker 和 Kubernetes 解决方案设置并准备就绪。

首先,正如其他人所提到的,最好的选择就是使用 Dockerfile from the repo 而不是自己编写:

### STAGE 1: Build ###
FROM node:12.7-alpine AS build
WORKDIR /usr/src/app
COPY package.json package-lock.json ./
RUN npm install
COPY . .
RUN npm run build

### STAGE 2: Run ###
FROM nginx:1.17.1-alpine
COPY nginx.conf /etc/nginx/nginx.conf
COPY --from=build /usr/src/app/dist/aston-villa-app /usr/share/nginx/html

clone the repo:

git clone https://github.com/wkrzywiec/aston-villa-app.git
cd aston-villa-app

创建您的 Docker 存储库 - 步骤是 presented here - 在这个例子中我将创建一个名为 testing-aston-villa-app.

的 public 存储库

在您的主机上登录 Docker registry

docker login
...
Login Succeeded

Build and push Docker image to your repo - commands are like this:

docker build -t <your_username>/my-private-repo .
docker push <your_username>/my-private-repo

在我们的示例中(确保您位于克隆 repo 的目录中):

docker build -t {your-username}/testing-aston-villa-app .
docker push {your-username}/testing-aston-villa-app

好的,图像现在在您的 Docker 存储库中。是时候在 Kubernetes 中使用它了。请在您 have kubectl installed and configured to interact with your cluster.

所在的主机上执行以下说明

以下 yaml 文件包含 deployment and for service 的定义。在 image 字段中,请使用 <your_username>/my-private-repo 名称:

apiVersion: apps/v1
kind: Deployment
metadata:
  name: aston-villa-app-deployment
spec:
  selector:
    matchLabels:
      app: aston-villa-app
  replicas: 2
  template:
    metadata:
      labels:
        app: aston-villa-app
    spec:
      containers:
      - name: aston-villa-app
        image: {your-username}/testing-aston-villa-app
        ports:
        - containerPort: 80
---
apiVersion: v1
kind: Service
metadata:
  name: aston-villa-app-service
spec:
  selector:
    app: aston-villa-app
  ports:
    - protocol: TCP
      port: 80
      targetPort: 80

请保存此 yaml 和 运行 kubectl apply -f {file.yaml}

应用后,检查pods是否启动并退出服务:

kubectl get pods,svc
NAME                                                  READY   STATUS      RESTARTS        AGE
pod/aston-villa-app-deployment-5f5478b66d-592nd       1/1     Running     0               13m
pod/aston-villa-app-deployment-5f5478b66d-vvhq2       1/1     Running     0               13m

NAME                              TYPE        CLUSTER-IP       EXTERNAL-IP   PORT(S)     AGE
service/aston-villa-app-service   ClusterIP   10.101.176.184   <none>        80/TCP      13m

现在,让我们通过从另一个 pod 向它发出请求来检查服务是否正常工作:

kubectl run -i --tty busybox --image=busybox -- sh
If you don't see a command prompt, try pressing enter.
/ # wget 10.101.176.184
Connecting to 10.101.176.184 (10.101.176.184:80)
saving to 'index.html'
index.html           100% |*****************************************************************************|   596  0:00:00 ETA
'index.html' saved
/ # cat index.html 
<!doctype html>
<html lang="en">
<head>
  <meta charset="utf-8">
  <title>AstonVillaApp</title>
  <base href="/">

  <meta name="viewport" content="width=device-width, initial-scale=1">
  <link rel="icon" type="image/x-icon" href="assets/images/as_logo.svg">
</head>
<body>
  <app-root></app-root>
<script type="text/javascript" src="runtime.js"></script><script type="text/javascript" src="polyfills.js"></script><script type="text/javascript" src="styles.js"></script><script type="text/javascript" src="vendor.js"></script><script type="text/javascript" src="main.js"></script></body>
</html>

请注意,我使用了 IP 地址 10.101.176.184,因为它是 service/aston-villa-app-service 的 IP 地址。在你的情况下,它可能会有所不同。