网站搜索

如何使用 Angular CLI 和 PM2 创建和运行 Angular 应用


Angular CLI 是 Angular 框架的命令行界面,用于在开发时在本地创建、构建和运行应用程序。

它旨在在开发服务器上构建和测试 Angular 项目。但是,如果您希望应用程序在生产环境中永远运行/保持活动状态,则需要 Node.js 流程管理器,例如 PM2。

PM2 是一款流行的、先进的、功能丰富的生产流程管理器,适用于具有内置负载均衡器的 Node.js 应用程序。

其功能集包括对应用程序监控的支持、微服务/进程的高效管理、运行应用程序集群模式以及应用程序的优雅重启和关闭。此外,它还支持轻松管理应用程序日志等等。

在本文中,我们将向您展示如何使用 Angular CLIPM2 Node.js 流程管理器运行 Angular 应用程序。这使您可以在开发过程中连续运行应用程序。

要求

您必须在服务器上安装以下软件包才能继续:

  • Node.js 和 NPM
  • 角度 CLI
  • 颗粒物

注意:如果您的 Linux 系统上已经安装了 Node.jsNPM,请跳转到 >第 2 步

第 1 步:在 Linux 中安装 Node.js

要安装最新版本的 Node.js,首先,如图所示在系统上添加 NodeSource 存储库 并安装软件包。不要忘记为要在 Linux 发行版上安装的 Node.js 版本运行正确的命令。

在 Ubuntu 上安装 Node.js

------------- For Node.js v19.x ------------- 
curl -fsSL https://deb.nodesource.com/setup_19.x | sudo -E bash - &&\
sudo apt-get install -y nodejs

------------- For Node.js v18.x -------------
curl -fsSL https://deb.nodesource.com/setup_18.x | sudo -E bash - &&\
sudo apt-get install -y nodejs

------------- For Node.js v16.x -------------
curl -fsSL https://deb.nodesource.com/setup_16.x | sudo -E bash - &&\
sudo apt-get install -y nodejs

------------- For Node.js v14.x -------------
curl -fsSL https://deb.nodesource.com/setup_14.x | sudo -E bash - &&\
sudo apt-get install -y nodejs

在 Debian 上安装 Node.js

------------- For Node.js v19.x ------------- 
curl -fsSL https://deb.nodesource.com/setup_19.x | bash - &&\
sudo apt-get install -y nodejs

------------- For Node.js v18.x ------------- 
curl -fsSL https://deb.nodesource.com/setup_18.x | bash - &&\
sudo apt-get install -y nodejs

------------- For Node.js v16.x ------------- 
curl -fsSL https://deb.nodesource.com/setup_16.x | bash - &&\
sudo apt-get install -y nodejs

------------- For Node.js v14.x ------------- 
curl -fsSL https://deb.nodesource.com/setup_14.x | bash - &&\
sudo apt-get install -y nodejs

在基于 RHEL 的发行版上安装 Node.js

------------- For Node.js v19.x ------------- 
curl -fsSL https://rpm.nodesource.com/setup_19.x | sudo bash -
sudo yum install -y nodejs

------------- For Node.js v18.x ------------- 
curl -fsSL https://rpm.nodesource.com/setup_18.x | sudo bash -
sudo yum install -y nodejs

------------- For Node.js v16.x ------------- 
curl -fsSL https://rpm.nodesource.com/setup_16.x | sudo bash -
sudo yum install -y nodejs

------------- For Node.js v14.x ------------- 
curl -fsSL https://rpm.nodesource.com/setup_14.x | sudo bash -
sudo yum install -y nodejs

此外,还要在您的系统上安装开发工具,以便您可以从NPM编译和安装本机插件。

sudo apt install build-essential  [On Debian/Ubuntu]
yum install gcc-c++ make          [On CentOS/RHEL]
dnf install gcc-c++ make          [On Fedora]

安装Node.jsNPM后,您可以使用以下命令检查它们的版本。

node -v
npm -v

步骤 2:安装 Angular CLI 和 PM2

接下来,使用 npm 包管理器 安装 Angular CLIPM2,如图所示。在以下命令中,-g 选项表示全局安装软件包 - 可供所有系统用户使用。

sudo npm install -g @angular/cli        #install Angular CLI
sudo npm install -g pm2                 #install PM2

步骤 3:使用 Angular CLI 创建 Angular 项目

现在进入服务器的 webroot 目录,然后创建、构建并提供您的 Angular 应用程序(称为 sysmon-app,将其替换为您的应用程序的名称):角度 CLI。

cd /srv/www/htdocs/
sudo ng new sysmon-app        #follow the prompts

接下来,进入刚刚创建的应用程序(完整路径为 /srv/www/htdocs/sysmon-app)目录,并为应用程序提供服务,如图所示。

cd sysmon-app
sudo ng serve

ngserve命令的输出中,您可以看到Angular应用程序没有在后台运行,您无法再访问命令提示符。因此,在它运行时您无法执行任何其他命令。

因此,您需要一个进程管理器来控制和管理应用程序:连续(永远)运行它,并使其能够在系统启动时自动启动,如下一节所述。

在进入下一部分之前,请按 [Ctl + C] 释放命令提示符来终止该进程。

第 4 步:使用 PM2 永久运行 Angular 项目

要使您的新应用程序在后台运行,释放命令提示符,请使用 PM2 为其提供服务,如图所示。 PM2 还可以帮助执行常见的系统管理任务,例如故障重新启动、停止以及无需停机即可重新加载配置等等。

pm2 start "ng serve" --name sysmon-app

接下来,要访问应用程序的 Web 界面,请打开浏览器并使用地址 http://localhost:4200 进行导航,如以下屏幕截图所示。

在本指南中,我们展示了如何使用 Angular CLIPM2 流程管理器运行 Angular 应用程序。如果您有任何其他想法要分享或有疑问,请通过下面的反馈表与我们联系。