如何将Angular应用程序作为Docker容器运行

我正在尝试将Angular 9应用程序作为Docker容器运行。这是我的Dockerfile：

FROM node:14.8.0-stretch-slim as build-env
LABEL desc="docker image of angular 9 app"
WORKDIR /app
COPY ["package.json","package-lock.json","/app/"]
RUN npm install
RUN npm install -g @angular/cli

COPY . /app
#ENTRYPOINT ["ng","--version"]
RUN ng build
CMD ng serve 
#Also tried 1) CMD ng serve --host 0.0.0.0 and 2) ENTRYPOINT ["ng","serve"]

docker run --rm -p 4200:4200 -it <image name>

它构建带有少量小警告的图像，然后构建容器

docker run -p 4203:4200 -d <image_id> 

docker run-p 4203:4200-d

我可以看到Docker容器正在运行（VS Code Docker extension&Docker ps命令显示容器已启动）。但当我尝试从浏览器访问应用程序时，它显示以下错误

如何从浏览器访问我的Angular应用程序

请注意：我将通过在上面的Dockerfile中添加第二个阶段来实现这一点，并将在某些服务器上托管该应用程序，但在此之前，我希望确保可以访问该应用程序。

编辑：

你可以试试

---

docker文件中的0.0.0.0:4200。这就是我的工作原理。

请将此CMD指令添加到您的dockerfile中

CMD ng serve --host 0.0.0.0 --port 4200

---

试试这个例子。这与您想做的非常相似
Dockerfile（示例）：

终端命令

创建图像

docker build -t <image name> .

因此，在docker run命令中，您必须附加您想要执行的操作：

docker run --rm -v <absolute path to src file>:/<project path>/src -p 4200:4200 -it <image_name> serve --host 0.0.0.0

docker-run-rm-v://src-p 4200:4200-it-service-host 0.0.0

或者创建一个组件

docker run --rm -v <absolute path to src file>:/<project path>/src -p 4200:4200 -it <image_name> component <component name>

docker-run--rm-v://src-p4200:4200-it组件

为什么不创建静态构建并从任何Web服务器（如docker的nginx）提供它，而不是

ng serve

？@miiii，是的，我会稍后再做。（如果你看到我的Dockerfile中有一个stage build env）@miiiii我如何检查该端口？（docker inspect没有显示任何此类信息。你能按照本文的步骤操作吗？。这与你正在做的事情以及将来想做的事情非常相似。除非你试图设置docker dev环境，否则你不想在容器中运行

ng SERVICE

。请参阅，例如，有关在节点中构建的简单设置从Nginx提供结果。我相信

EXPOSE

只是元数据，它对于实际公开端口不是必要的或足够的：我更改了答案。是的，它解决了问题。但是请您添加一点解释吗？谢谢！@Kgn web默认情况下，ng serve只在本地主机上侦听。如果您想从外部世界访问它（这里是你的电脑）你可以使用0.0.0.0。这基本上意味着监听任何ipv4地址。

ENTRYPOINT ["ng"] 

docker run --rm -v <absolute path to src file>:/<project path>/src -p 4200:4200 -it <image_name> serve --host 0.0.0.0

docker run --rm -v <absolute path to src file>:/<project path>/src -p 4200:4200 -it <image_name> component <component name>