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

Question

我试图运行一个角9应用程序作为一个码头容器。这是我的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 -p 4203:4200 -d <image_id> 

我可以看到Docker容器正在运行(VS container扩展& docker ps命令显示容器正在运行)。但是，当我尝试从浏览器访问该应用程序时，它会显示以下错误

​

​

我如何从浏览器访问我的角度应用程序？

请注意:我将通过在上述Dockerfile中添加第二阶段来推进这一步，并将在某些服务器上托管该应用程序，但在此之前，我希望确保该应用程序可以被访问。

Answer 1

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

CMD ng serve --host 0.0.0.0 --port 4200

Answer 2

试试这个例子。这和你想做的很相似

Dockerfile (示例)：

FROM node:14

RUN npm install -g @angular/cli 

WORKDIR /frontend

COPY package.json .

RUN npm install

COPY . .

EXPOSE 4200

CMD ng serve --host 0.0.0.0 

终端命令

创建图像

docker build -t <image name> .

启动容器(使用命令"serve“和”-host“附加在Dockerfile中创建的"ng”命令)：

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

此外，您可能希望在容器中添加卷以映射本地文件夹：

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

如果希望在Dockerfile末尾使用ENTRYPOINT，请使用以下命令：

ENTRYPOINT ["ng"] 

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

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>

Answer 3

编辑：

您可以在docker文件中尝试0.0.0.0:4200。我就是这么干的。