如何在 Linux 上安装 Angular CLI

Angular是一个开源、流行且高度可扩展的前端应用开发框架，用于使用TypeScript/JavaScript和其他常见语言构建移动和Web应用程序。

Angular是一个统称，包括AngularJS之后的所有版本（或称Angular版本1.0），包括Angular 2和Angular 4。

Angular非常适合从头开始构建小到大型应用程序。Angular平台的关键组件之一是Angular CLI实用程序 – 这是一个简单易用的命令行工具，用于创建、管理、构建和测试Angular应用程序。

在本文中，我们将解释如何在Linux系统上安装Angular命令行工具，并学习该工具的一些基本示例。

在Linux中安装Node.js

要安装Angular CLI，您需要在Linux系统上安装最新版本的Node.js和NPM。

在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、CentOS、Fedora、Rocky和Alma Linux上安装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 -y build-essential  [On Debian/Ubuntu]
$ sudo yum install gcc-c++ make        [On RHEL Systems]

在Linux上安装Angular CLI

一旦您已经安装了Node.js和NPM，如上所示，您可以使用npm软件包管理器按如下所示安装Angular CLI（-g标志表示系统范围内安装该工具，以供所有系统用户使用）。

# npm install -g @angular/cli
OR
$ sudo npm install -g @angular/cli

您现在可以使用已在系统上安装的ng可执行文件启动Angular CLI。运行以下命令以检查已安装的Angular CLI的版本。

# ng version
OR
# ng --version

使用Angular CLI创建Angular项目

在本节中，我们将展示如何创建、构建和提供一个新的基本Angular项目。首先，进入您服务器的webroot目录，然后按如下方式初始化一个新的Angular应用程序（记得按照提示操作）：

# cd /var/www/html/
# ng new tecmint-app			#as root
OR
$ sudo ng new tecmint-app		#non-root user

接下来，进入刚创建的应用程序目录，并按如下所示提供该应用程序。

# cd tecmint-app
# ls 			#list project files
# ng serve

在您可以从Web浏览器访问新应用程序之前，如果您有防火墙服务正在运行，您需要按如下所示在防火墙配置中打开端口4200。

---------- On Firewalld ---------- 
# firewall-cmd --permanent --zone=public --add-port=4200/tcp 
# firewall-cmd --reload

---------- On UFW ----------
$ sudo ufw allow 4200/tcp
$ sudo ufw reload

现在，您可以打开 Web 浏览器，使用以下地址进行导航，以查看新应用程序运行的情况，如下面的截图所示。

http://localhost:4200/ 
or 
http://SERVER_IP:4200

注意：如果您使用命令 ng serve 构建一个应用程序并在本地提供服务，如上所示，当您更改任何源文件时，服务器会自动重新构建应用程序并重新加载网页。

有关 ng 工具 的更多信息，请运行以下命令。

# ng help

Angular CLI 主页：https://angular.io/cli

在本文中，我们展示了如何在不同的 Linux 发行版上安装 Angular CLI。我们还介绍了如何在开发服务器上构建、编译和提供基本的 Angular 应用程序。如果您有任何疑问或想法要与我们分享，请使用下面的反馈表。