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

【问题标题】：How can I integrate two different servers like Angular and NodeJs?如何集成两个不同的服务器，如 Angular 和 NodeJs？
【发布时间】：2019-01-07 00:36:28
【问题描述】：

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

按照 Angular 教程，创建一个新服务器：

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

【问题讨论】：

2台服务器是什么意思？ Angular 在前端，Nodejs 在后端。除非您对 Angular 使用 SSR（服务器端渲染）方法，否则您可以在服务器上运行它（而不是构建它，仍然将它放在服务器上但不能直接使用 ng-serve 运行它）。加入是什么意思？
感谢您的回答。当您运行该命令（ng new）时，它会自行创建一个完整的服务器，它已经是您可以运行和浏览的服务器。但是我有另一个节点服务器已经在与其他已经开发的东西一起运行。我的问题是，如何将我所有的 Angular 新项目添加到我已经存在的节点服务器中。

标签： node.js angular server

【解决方案1】：

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

如果您想使用节点托管 Angular 页面 - 当节点可以访问复制文件时，将文件从 projektFolder/dist 复制到目录。在节点中，您可以使用 express 库来托管静态文件：

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

More info about hosted static files in node and express

编辑

您使用 Angular CLI 构建 Angular 应用程序。这是使用 Angular 的附加工具，您不必使用它。

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

ng 服务

ng serve 是一个来自 Angular 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()。更多信息在顶部。

【讨论】：

我知道 Angular 不是服务器，它是一个基于 JavaScript 的前端框架。但我不明白为什么用ng serve 启动服务器。那是什么样的服务器？那么将我的 Angular 项目部署到另一个节点服务器就像将 projectFolder/dist 复制到节点服务器一样简单？
更清楚地说，在我的节点服务器中，角度部分由两个文件组成，一个服务和一个控制器。但是在这个使用 CLI 制作的新服务器中，我有很多文件、库和 .json 文件。我关心的是使用复杂的服务器，然后我如何使它在我以前的节点服务器中工作？
我已经编辑了我的帖子。也许他现在会更有帮助
非常感谢，是的。