第一步,安装依赖
#gcc安装,nginx源码编译需要 yum install gcc-c++ #PCRE pcre-devel 安装,nginx 的 http 模块使用 pcre 来解析正则表达式 yum install -y pcre pcre-devel #zlib安装,nginx 使用zlib对http包的内容进行gzip yum install -y zlib zlib-devel #OpenSSL 安装,强大的安全套接字层密码库,nginx 不仅支持 http 协议,还支持 https(即在ssl协议上传输http) yum install -y openssl openssl-devel
第二步,下载Nginx
方式一,直接官方网站下载 【官网链接】,如下图,选择最新稳定版进行下载。
方式二,通过命令进行下载。
#下载版本号可根据目前官网最新稳定版自行调整 wget -c https://nginx.org/download/nginx-1.20.2.tar.gz
第三步,安装
#根目录使用ls命令可以看到下载的nginx压缩包,然后解压 tar -zxvf nginx-1.16.1.tar.gz #解压后进入目录 cd nginx-1.16.1 #使用默认配置 ./configure #编译安装 make make install #查找安装路径,默认都是这个路径 [root@VM_0_12_centos ~]# whereis nginx nginx: /usr/local/nginx #查看nginx进程,如下返回,即为成功 [root@VM_0_12_centos ~]# ps aux|grep nginx root 5984 0.0 0.0 112708 976 pts/1 R+ 14:41 0:00 grep --color=auto nginx root 18198 0.0 0.0 20552 612 ? Ss 11:28 0:00 nginx: master process ./nginx nobody 18199 0.0 0.0 23088 1632 ? S 11:28 0:00 nginx: worker process
第四步,配置命令全局执行
#进入 nginx 命令目录 cd /usr/local/nginx/sbin/ #创建软连接 ln -s /usr/local/nginx/sbin/nginx /usr/local/bin/nginx
第五步,常用命令
#启动、停止nginx nginx #启动 nginx -s stop #停止 nginx -s quit #退出停止 nginx -s reload #重新加载配置文件 #重启nginx,建议先停止,再启动 nginx -s stop nginx
第六步,设置开机自启动
#在rc.local增加启动代码即可 vi /etc/rc.local #增加一行 /usr/local/nginx/sbin/nginx ,增加后保存 #设置执行权限 cd /etc chmod 755 rc.local
如下图所示进行配置:
这样 Nginx 就搭建成功了,下面我们进行部署 Vue 项目。
第一步,项目调整
(1)修改 vue.config.js
文件,依赖静态资源路径。
(2)修改src/router/index.js
文件,路由跳转路径。
第二步,Nginx 配置文件
#进入nginx配置文件目录,找到nginx的配置文件nginx.conf cd /usr/local/nginx/conf/ #直接修改 vi nginx.conf
基础配置,标红部分是调整部分,其他都是默认配置。
keepalive_timeout 1800; client_max_body_size 102400m; proxy_max_temp_file_size 102400m; proxy_buffer_size 128k; proxy_buffers 32 128k; proxy_busy_buffers_size 128k; gzip on; gzip_comp_level 2; gzip_types text/css application/javascript application/json; gzip_disable "MSIE [1-6]\.";
最后一行加上 include /usr/local/nginx/conf/vhosts/*.conf;
,进行加载其他配置文件。
配置其他配置文件,首先在目录 /usr/local/nginx/conf
新建 vhosts
文件夹,然后在文件夹下面创建其他配置文件。
#进入文件目录 cd /usr/local/nginx/conf #创建文件夹 mkdir vhosts #进入文件夹 cd vhosts #创建配置文件 vi blog.conf
如下图进行配置,注意标红部分。
server { listen 80; server_name varyblog.cn; location /blog { alias /home/nginx/blog/dist/; try_files $uri $uri/ /blog/index.html; index index.html index.htm; } error_page 500 502 503 504 /50x.html; location = /50x.html { root html; } }
最后,重新加载配置文件。
nginx -s reload