NestJs - Angular - 部署策略答案

【问题标题】：NestJs - Angular - Deployment strategyNestJs - Angular - 部署策略
【发布时间】：2020-09-21 20:36:51
【问题描述】：

我为一家有特定需求的工厂开发了一个小型应用程序。这是一个小型应用程序，本地使用人数少于 10 人。

目前，我的后端和前端在同一个 git 存储库中。

存储库结构如下所示

--README.md
--.gitignore
--document
--projects
  |--backend        // Nestjs API
  |--frontend       // Angular

我已经准备好 NestJS 来提供静态文件，这意味着我已经将我的 Angular 构建器配置为如下工作：

angular.json

...
"options": {
    "outputPath": "../backend/client/dist",
    "index": "src/index.html",
    "main": "src/main.ts",
    "polyfills": "src/polyfills.ts",
    "tsConfig": "tsconfig.app.json",
    "aot": true,
...

我的 NestJs 服务器配置为提供静态文件：

main.ts

const PORT = process.env.PORT || 8080;
async function bootstrap() {
   const app = await NestFactory.create<NestExpressApplication>(AppModule);
   app.enableCors();
   app.setGlobalPrefix('api');
   await app.listen(PORT);
}
...

app.module.ts

imports: [
    TypeOrmModule.forRoot(),
    ServeStaticModule.forRoot({
      rootPath: join(__dirname, '..', 'client/dist'),
    }),

直到今天，我还在使用带有npm run start:dev 的 npm，它允许我自动构建我的数据库并运行后端服务器。现在，我需要将后端和前端部署到同一台服务器并构建所有内容。

什么是最好的方法？我是否应该首先将 angular 构建到 dist 文件夹中，构建 nestjs .. 我只能将 dist 文件夹放到生产服务器上吗？

【问题讨论】：

您是否使用 NestJs 来为您的 Angular 应用程序提供服务？
是的！我的 NestJs 应用程序正在为我的 Angular 客户端提供服务。我创建了一个脚本来部署所有内容......
你是在linux还是windows上部署？
你也在用apache吗？
开发环境在 Windows 下运行，所以我创建了一个小 Powershell 脚本，它运行 CLI 工具来构建所有内容（Angular、Nest、配置），我的产品环境是一个运行 Nodejs 的 LXD 容器服务器，使用PM2管理进程

标签： angular typescript deployment nestjs

【解决方案1】：

我会做的是构建您的 Angular 应用程序并复制您为前端提供服务的文件。如果您的应用被路由，您还必须配置一个回退到 index.html，您可以在此处查看如何：Angular deployement

对于你的 nestjs 应用程序，你可以把它放在你服务器上的任何地方，pm2 将在端口 8080 上为它提供服务。首先从 nestjs 中提取所有文件并使用 npm install （你需要在 prod 中的 node_modules 也与 nestjs 一起使用） .然后使用 nest build 来构建您的应用程序。使用 pm2，您应该使用 main.js 来启动您的 api。然后我会研究一个代理反向配置，将你所有的 api 请求重定向到 8080。它的作用是，如果你到达 example.com/api，你的服务器会明白它必须在内部重定向到 8080，所以你没有打开任何其他端口，然后 80 就是你想要的。

我还会考虑在您的服务器启动时启动 pm2 并保存您的 pm2 配置，以便在您重新启动服务器时自动启动您的后端。

【讨论】：