如何集成两个不同的服务器，例如Angular和NodeJs？

Question

我是Angular和NodeJS的新手。我已经完成了所有基本文档，现在正在做教程。我的问题是关于体系结构。

按照角度教程，您将创建一个新服务器：

ng new new-project

这将创建一个完整的服务器来监听端口4200，您将学习并使用angular并了解指令等。

然后使用节点创建服务器，配置路由等。 但是这两台服务器如何一起生活？ 您如何推荐我加入他们的行列？

This is a node server. The angular part are just two files

This is the server created with ng serve. The angular part is so much complicated

Answer 1

Angular项目不是服务器。 Angular是用于创建前端页面/应用程序的框架。 Angular-cli命令ng serve用于在本地主机上构建应用程序并启动Web服务器。 当您使用angular构建页面时，请使用angular-cli命令ng build --prod来构建页面（more info about ng build command）。构建工件将存储在项目的dist/目录中。

如果要使用节点托管角度页面，请在节点可以访问复制文件时将文件从 projektFolder / dist 复制到目录。在节点中，您可以使用快速库来托管静态文件：

app.use('/myangularproject', express.static('myangularproject')) //host static files`

More info about hosted static files in node and express

编辑

您使用Angular CLI来构建角度应用程序。这是用于处理角度的附加工具，您不必使用它。

  

Angular cli是一个命令行界面，用于使用nodejs样式（commonJs）模块构建和构建angular应用程序。它不仅为您提供可伸缩的项目结构，而且还为您开箱即用地处理所有常见的繁琐任务

ng服务

ng serve是来自角度cli的工具。当您调用此命令时，您的项目将构建在内存中，并通过webpack-dev-server提供服务。 它用于快速预览和开发项目。如果此命令使您感到困惑，则可以使用npm脚本npm start。

  

CLI支持通过运行ng serve向用户运行实时浏览器重新加载体验。保存文件后将编译该应用程序，并使用新编译的应用程序重新加载浏览器。这是通过将应用程序托管在内存中并通过webpack-dev-server提供服务来完成的。 doc

ng构建

ng build将应用程序编译到输出目录中。

  

将Angular应用编译到给定输出路径下名为dist /的输出目录中。必须在工作空间目录中执行。

使用命令ng new时，Angular CLI添加所有必需的文件以开发应用程序。其中一些用于配置项目，例如tslint.json，tsconfig.json，angular.json ...不要仅托管使用ng build命令的结果文件来托管这些文件（ /dist目录。

Angular CLI将您的项目编译成多个文件（尝试ng build并查看/dist中有多少个文件。您必须托管所有这些文件。这些都是静态文件。您不需要像php文件这样的特殊服务器。您可以使用常规文件服务器来托管它们。我不知道您要在节点中使用什么来托管静态文件。如果它们使用express，则可以使用express.static()。顶部有更多信息。