方格角巡回赛

Question

我是码头公司的新手，我正在尝试将“英雄之旅”这个“英雄之旅”的角度样本项目进行对接，你可以在这里找到：

https://angular.io/generated/zips/toh-pt6/toh-pt6.zip

我根据我研究的内容创建了Dockerfile，它看起来如下：

DOCKERFILE

FROM node:latest

RUN mkdir -p /src/app
WORKDIR /src/app

COPY package.json /src/app
RUN npm install

COPY ./ /src/app

EXPOSE 4200
ENTRYPOINT npm start

当我构建容器时，它不会抛出任何错误。

然后，我试着用

docker run -p 4200:4200 toh:app

然后它运行ng serve (Idk，为什么，我没有把这个命令放在Dockerfile上，但我认为是因为Node(？)版本)。并说它成功地编译了。

但是在Localhost上:4200显示了ERR_EMPTY_RESPONSE中"Localhost没有发送任何数据“的消息。

我看到，当涉及到码头的问题，人们通常也张贴package.json文件，所以我也张贴。

PACKAGE.JSON

{
    "name": "angular-tour-of-heroes",
    "version": "0.0.0",
    "scripts": {
    "ng": "ng",
    "start": "ng serve",
    "build": "ng build",
    "test": "ng test",
    "lint": "ng lint",
    "e2e": "ng e2e"
},
"private": true,
"dependencies": {
  "@angular/animations": "~10.1.6",
  "@angular/common": "~10.1.6",
  "@angular/compiler": "~10.1.6",
  "@angular/core": "~10.1.6",
  "@angular/forms": "~10.1.6",
  "@angular/platform-browser": "~10.1.6",
  "@angular/platform-browser-dynamic": "~10.1.6",
  "@angular/router": "~10.1.6",
  "angular-in-memory-web-api": "^0.11.0",
  "rxjs": "~6.6.0",
  "tslib": "^2.0.0",
  "zone.js": "~0.10.2"
},
"devDependencies": {
  "@angular-devkit/build-angular": "~0.1001.7",
  "@angular/cli": "~10.1.7",
  "@angular/compiler-cli": "~10.1.6",
  "@types/node": "^12.11.1",
  "@types/jasmine": "~3.5.0",
  "@types/jasminewd2": "~2.0.3",
  "codelyzer": "^6.0.0",
  "jasmine-core": "~3.6.0",
  "jasmine-spec-reporter": "~5.0.0",
  "karma": "~5.0.0",
  "karma-chrome-launcher": "~3.1.0",
  "karma-coverage-istanbul-reporter": "~3.0.2",
  "karma-jasmine": "~4.0.0",
  "karma-jasmine-html-reporter": "^1.5.0",
  "protractor": "~7.0.0",
  "ts-node": "~8.3.0",
  "tslint": "~6.1.0",
  "typescript": "~4.0.2"
 }
}

我认为问题在码头文件，但我不知道我是不是错过了一个明显的东西，或它可能是什么。

提前谢谢。

编辑

正如您可以在下面的评论中看到的那样，我试图通过运行带有ng服务的容器来修改它，并问自己为什么每个人都在使用nginx服务器。所以我问了一些朋友，他们的反应是：

Ng服务是用于开发的，但是当您尝试修改应用程序时，您应该使用nginx服务器，将/dist文件处理到usr/nginx/share/html中。

我修改了码头，现在看起来是这样的：

FROM node:10-alpine as build-step

RUN mkdir -p /app

WORKDIR /app

COPY package*.json /app

RUN npm install

COPY . /app

RUN npm run build --prod

#NGINX

FROM nginx:1.17.1-alpine

COPY --from=build-step /app/dist/angular-tour-of-heroes /usr/share/nginx/html

顺便说一句，感谢FlorentB试图帮助我解决这个问题。

Answer 1

正如您可以在下面的评论中看到的那样，我试图通过运行带有ng服务的容器来修改它，并问自己为什么每个人都在使用nginx服务器。所以我问了一些朋友，他们的反应是：

Ng服务是用于开发的，但是当您尝试修改应用程序时，您应该使用nginx服务器，将/dist文件处理到usr/nginx/share/html中。

我修改了码头，现在看起来是这样的：

FROM node:10-alpine as build-step

RUN mkdir -p /app

WORKDIR /app

COPY package*.json /app

RUN npm install

COPY . /app

RUN npm run build --prod

#NGINX

FROM nginx:1.17.1-alpine

COPY --from=build-step /app/dist/angular-tour-of-heroes /usr/share/nginx/html

顺便说一句，感谢FlorentB帮助我解决这个问题。

Answer 2

节点dockerfile中不需要入口点。它自动开始使用npm命令。

诺塔：

• WORKDIR指令选择文件夹作为下列操作的根。不需要复制/src/app。
• I将复制package*.json以使-lock文件也被复制，执行
• ng服务，因为您的package.json文件sais是这样做的。**“开始”："ng服务“，**行意味着当您使用npm时，它确实提供服务。