nginx部署前端项目 (Linux版)

一: nginx部署前端项目(Windows版)

nginx部署前端项目(Windows版本)

二: 下载相关依赖

yum install -y gcc-c++ pcre pcre-devel zlib zlib-devel openssl openssl-devel

gcc-c++: 这是GNU编译器集合中的C++编译器，用于编译C++代码。
pcre: Perl兼容正则表达式库，提供正则表达式支持。
pcre-devel: pcre库的开发文件，包括头文件和静态库，用于开发依赖于pcre的应用程序。
zlib: 一个数据压缩库，提供基本的压缩和解压缩功能。
zlib-devel: zlib的开发文件，包括头文件和库，用于开发依赖于zlib的应用程序。
openssl: 提供安全通信的加密库，支持SSL/TLS协议。
openssl-devel: openssl的开发文件，包括头文件和库，用于开发依赖于openssl的应用程序。

我这里是之前已经下载过一次了，很多时候会在下载后出现很多问题，需要解决问题来避免后续编译nginx出现问题

三: 下载安装nginx

nginx-linux官网下载地址

1. 可以下载离线包后上传linux
2. linux通过wget下载

wget http://nginx.org/download/nginx-1.27.1.tar.gz

# 解压nginx安装包
tar -zxf nginx-1.27.1.tar.gz

下载后解压，注意版本号不同需要自行修改，解压后当前目录下就有一个nginx的文件夹。

# 进入nginx文件夹
cd nginx-1.27.1
# 配置nginx
./configure

nginx可以选配，也可以默认配置。
这个就好像安装一个windows程序，先下载安装包，然后打开安装包再去选择一个位置安装软件

输入 ./configure 默认安装后成功如下
nginx path prefix: nginx的路径

最后还需要执行一个 “确认安装” 的一个命令

# 编译并安装
 make && make install

进入到默认安装时的默认路径 /usr/local/nginx

1. conf: nginx配置文件
2. html: 默认资源路径
3. logs: 日志
4. sbin: 启动指令文件

四: 启动nginx

进入到 sbin 目录下启动nginx测试是否成功
启动nginx后，nginx根目录会出现一些其他的文件夹，是 ./configure 时安装的一些其他功能模块
启动后 curl 访问是 404 的话代表启动失败了，需要到 nginx/logs 文件夹下查看原因
启动成功后 nginx/logs 文件夹下会多出一个 nginx.pid 进程文件，启动失败则没有

# 进入sbin目录
cd sbin
# 启动nginx
./nginx
# 云服务器开启 80 端口后可以通过浏览器访问或通过 curl 命令访问是否启动成功
curl 127.0.0.1

五: 部署前端项目

项目打包成一个 dist 文件夹上传到项目某个位置或者 nginx/html 中，我这直接放在了 html 文件夹中

修改 nginx.conf 配置文件配置
root路径修改至要访问的项目路径
端口，域名都可以更改，甚至nginx还有很多其他的功能，我这里只做了简单配置部署前端项目

 server {
    listen       80;
    server_name  localhost;
    location / {
       root   html/dist;
       index  index.html index.htm;
    }

修改后在 sbin 目录下通过nginx命令重启后，浏览器或者 curl 都可以访问到项目了

# 进入sbin
./nginx -s reload

云服务器是需要开放80端口的才能在外部浏览器访问
虚拟机是需要放行80端口的防火墙才能在外部浏览器访问