CentOS教程实战项目开发教程

从零到一：在CentOS上部署一个真实的Angular应用

您是不是也遇到过这种情况？跟着教程学了半天HTML、Angular，代码在自己电脑上跑得好好的，可一到要部署到真正的服务器上，就两眼一抹黑。什么Nginx配置、防火墙、域名解析……一堆陌生的名词砸过来，瞬间就从开发者变成了运维小白。

说实话，理论和实战之间，往往就差一个“服务器部署”的距离。今天，咱们不聊虚的，就干一件事：手把手带您走一遍从购买阿里云服务器，到在CentOS上成功运行一个Angular应用的全过程。就像搭积木一样，我们把每一块都摆清楚。

咱们的项目总得有个家，对吧？这个家就是云服务器。就拿阿里云来说，对新用户特别友好，经常有优惠活动。

购买的时候，您会看到一堆配置选项，坦白讲，对于学习和小型项目，选最基础的配置就足够了：1核CPU，2G内存，CentOS 7.x 或 8.x 的系统。CentOS因为稳定、资料多，一直是企业部署的热门选择。

服务器买好，拿到两个关键东西：公网IP地址（您网站的门牌号）和登录密码。接下来，我们得远程登录进去“装修”。

这里我推荐用SSH工具，比如Xshell或者FinalShell。连接上之后，第一件事往往不是装软件，而是“打补丁”：运行 yum update -y，更新系统所有软件包。这就像新房子先做基础加固，安全又稳定。

然后，咱们把必要的“家具”搬进来：

安装Nginx： 它将是我们的网页服务器，负责把您的Angular项目展示给访客。命令很简单：yum install nginx -y。安装后，记得用 systemctl start nginx 启动它。
配置防火墙： 默认情况下，服务器的门（端口）是关着的。我们需要把HTTP（80端口）和HTTPS（443端口）打开。用命令 firewall-cmd --permanent --add-service=http 和 ...add-service=https，然后重载防火墙。

这时候，您直接在浏览器输入服务器的公网IP，如果能看到Nginx的欢迎页面，恭喜您！服务器的基础环境就算搭好了。

服务器准备好了，该我们的主角——Angular应用上场了。我知道，您可能已经跟着Angular教程做了一个漂亮的小应用，比如一个待办事项列表，或者一个产品展示页面。

这里有个关键点：我们本地开发用的是 ng serve，它会启动一个开发服务器，但这个东西性能不行，也不能持久运行。真正要部署的，是打包编译好的“成品”。

所以，在您自己的电脑上，打开Angular项目，运行这个黄金命令：

ng build --prod

这个命令会做一系列优化：压缩代码、移除没用的部分、打包成静态文件。完成后，您会在项目目录下看到一个 dist/您的项目名 的文件夹。里面就是一堆HTML、JS、CSS文件。您接下来的任务，就是把这些文件，整个上传到服务器上去。

怎么上传呢？我习惯用FileZilla这类FTP/SFTP工具，配置上服务器的IP、用户名和密码，就能像操作本地文件夹一样，把本地的 dist 文件夹，拖到服务器的某个目录下，比如 /home/www/ 里面。

文件传上去了，但怎么让全世界通过IP地址访问到呢？这就靠Nginx来指路了。

我们需要修改Nginx的配置文件。它的位置通常在 /etc/nginx/nginx.conf 或者 /etc/nginx/conf.d/default.conf。

用vim编辑器打开它，找到 server { ... } 这个部分，关键是把“网站根目录”指向我们刚才上传文件的地方：

把 root 后面的路径，改成 /home/www/您的项目名；
index 后面确保有 index.html；
还有一个很重要的配置，为了Angular等单页应用能正常路由，需要在location / { ... } 里面加上 try_files $uri $uri/ /index.html; 这一行。

改完配置文件，千万别忘了测试一下配置对不对：运行 nginx -t。如果显示“syntax is ok”，就可以重启Nginx了：systemctl restart nginx。

现在，激动人心的时刻到了！再次打开浏览器，输入您的服务器公网IP。您看到了什么？是不是您亲手写的那个Angular应用，已经堂堂正正地运行在互联网上了！