如何将 Angular 前端与 NestJS 后端合并答案

【问题标题】：How to merge togheter Angular frontend with NestJS backend如何将 Angular 前端与 NestJS 后端合并
【发布时间】：2022-01-13 19:58:59
【问题描述】：

我正在关注 Sololearn 上的教程，了解如何使用 NestJS 和 Angular 创建应用程序，它说我需要运行Angular 服务器和 NestJS 服务器分开，有没有办法在同一台服务器上运行它们？我曾经在 PHP 中编写代码，您有不同的路线，您可以根据它们回退 HTML 页面，但现在我有一个根据 url 更改的页面。所以，在这一切之后，问题仍然是一样的：有没有办法将 Angular 和 NestJS 作为同一台服务器运行？

【问题讨论】：

标签： angular nestjs mean-stack

【解决方案1】：

简短回答：是的。
为此：
前端（角度）：

将 Angular 项目中 api 的 url 更改为 /api
构建你的 Angular 项目ng build // or ng build --prod // for poduction

后端（Nestjs）：

将npm install --save @nestjs/serve-static 安装到服务器静态文件
将 Angular 构建输出 dist 文件夹移动到具有不同名称的 nestjs 项目，例如 frontend

将ServerStaticModule 导入Appmodule

    imports: [
    ServeStaticModule.forRoot({
      rootPath: join(__dirname, '..', 'frontend'),
    }),
  ],

然后您可以从 http://localhost:port 访问您的网站

更多详情：

Server Static nestjs doc

Use nest as your server-side application with an Angular frontend

【讨论】：

【解决方案2】：

您可以在同一“物理”服务器上运行它们。但是他们需要单独开始（用于开发目的）ng serve 用于 Angular 和 Nest Start 用于 Nest 后端。

绝对没有必要在不同的“物理”服务器上执行它们:)。

【讨论】：

我并不是要在两个不同的物理服务器上启动它们，而是要像使用“nest start”一样运行两个服务器（ng serve、nest start）
啊，好吧，如果你真的想（不鼓励），你可以使用 Nest 作为你的网络服务器，例如像这样的东西`@Controller() export class AppController { @Get() root(@ Res() response): void { // 主页将加载包含角度逻辑的 index.html response.sendFile(path.resolve('../dist/index.html')); ` index.html 是在您进行 ng 构建后为您生成的一个角度。 medium.com/@bo.vandersteene/…