Javascript 如何在不使用ng serve的情况下为Angular 5应用程序提供服务？

我可以使用

ng serve

构建和服务Angular 5项目，并在浏览器中查看它。我想将文件移动到docker容器上，因为我的最终应用程序需要有一个php后端

当我将使用

ng serve

运行的同一个文件系统移动到docker构建并尝试导航到它时，我收到一个服务器错误

我知道该容器工作正常，因为我可以在相应的localhost端口向浏览器提供PHP文件，而不会出现任何问题。因此，它需要有角度的东西，这是造成误差的原因

我注意到

ng新的英雄之旅
项目在根项目目录中没有index.html。当我将
src/
文件夹中的文件移到根目录下时，浏览器中仍然没有任何内容

如何使用Docker而不是ng serve为Angular应用程序提供服务？
这个答案将分为两部分，因为听起来您可能不熟悉构建过程

建筑
这对于大多数JavaScript框架来说更为通用。通常有一个“构建”过程，以某种方式生成静态web应用程序，web服务器可以为其提供服务

如果是角度，则为
ng build
。您可以在上了解有关该命令的更多信息。
ngbuild
命令将在项目中创建一个
dist
目录，其中包含构建的HTML、CSS<和JavaScript。此目录中的文件是您将推送到web服务器以提供服务的文件

码头工人
现在我们已经了解了如何获取web应用程序的源代码，我们希望将其作为容器运行。基于你的问题，我假设你已经有了一个Docker镜像和一个web服务器。在这种情况下，您可以将
dist
文件夹复制到与构建web服务器的现有
Dockerfile
相同的位置，并在
Dockerfile
中添加一行内容，例如：

COPY dist/* /my/webserver/root

如果您可以提供有关现有映像、
Dockerfile
和环境的更多信息，我可以提供一个更好的示例，为最终的web服务器映像构建和生成角度应用程序

不过，您不一定需要从PHP应用程序中为Angular应用程序提供服务。如果您的Angular应用程序正在连接到PHP应用程序，它们可能仍然是链接在一起的单独Docker图像和容器。
如果您运行ng build，它将创建一个
dist
目录。如果您从该目录导航到
index.html
文件，它应该会工作得很好！我注意到，如果部署到两个单独的容器，则必须从服务器端应用程序中设置默认值。了解构建过程肯定会有所帮助，因为这是我第一次尝试JS框架。正如奥尔曼教授所说，对于更复杂的请求，CORS最初是一个问题。但这超出了这个问题的范围。你的回答帮了大忙！