win11 nat网络下部署nginx 在nginx下部署前端项目

win11 nat网络下部署nginx 在nginx下部署前端项目

1.远程连接网络

• 查看ip
  ip addr

• 在xshell中新建会话窗口，输入主机地址并连接

• 进入配置文件
  vi /etc/sysconfig/network-scripts/ifcfg-ens33

• 修改onboot

• 保存并退出，重启网络# systemctl restart network

• 测一下网络 # curl www.baidu.com

• 有网的状态是这样

• 远程连接成功的页面

  

2.部署nginx

yum安装

配置nginx源

• # 执行如下命令

  rpm -ivh http://nginx.org/packages/centos/7/noarch/RPMS/nginx-release-centos-7-0.el7.ngx.noarch.rpm

  配置成功界面如下

  

# cd /etc/yum.repos.d/

#ls

在/etc/yum.repos.d/ 下看到多了一个nginx.repo文件 如下图

执行以下命令开始安装

yum install -y nginx

启动nginx,没有报错，则启动成功

nginx

源码编译安装

• 下载安装包

进入官网下载：nginx: download

• 下载后上传至虚拟机

  1.新建一个目录用来存放nginx 相关文件

  mkdir -p /usr/local/nginx

  2.进入压缩包所在目录

  cd /usr/local/nginx

  3.查看文件

  #ll

  4.解压

  tar -zxvf nginx-1.22.1.tar.gz

  解压后如下

  

• 安装编译环境

  1.安装gcc，源码编译依赖 gcc 环境

  yum -y install gcc-c++

  2.安装pcre，pcre是一个perl库，包括perl兼容的正则表达式库，nginx的http模块使用pcre来解析正则表达式，所以需要安装pcre库

  yum install -y pcre pcre-devel

  3.安装zlib，zlib 库提供了很多种压缩和解压缩的方式，nginx 使用 zlib 对 http 包的内容进行 gzip

  yum install -y zlib zlib-devel

  4.安装OpenSSL库

  yum install -y openssl openssl-devel

• 进入解压后的目录

  cd /usr/local/nginx/

  cd nginx-1.22.1

• 执行安装

  ./configure

  make

  make install

• 输入 whereis nginx 检查是否安装成功，如果出现路径则安装成功*

  whereis nginx

  在 /usr/local/nginx 目录下

• 进入安装目录

  cd /usr/local/nginx

  查看目录

  ls

  启动nginx

  ./sbin/nginx

• 查看进程

  ps -ef | grep nginx

• 查看防火墙状态

  状态显示未关闭，我们需要关闭它

  

  关闭防火墙命令

  systemctl stop firewalld

• 浏览器访问IP

  

  部署成功！

  3.部署前端项目

  1.用vscode打开下载好的文件夹

  先后运行 pnpm install命令和pnpm run build命令，将项目打包为dist文件夹并上传至虚拟机。

  在这个过程中我遇到了：无法加载文件 C:\Users\hp\AppData\Roaming\npm\cnpm.ps1，因为在此系统上禁止运行脚本 的问题，解决办法见

  [http://t.csdnimg.cn/0Oflw]:

  1.点击左下角开始，找到Windows PowerShell，点击右键找到更多，找到以管理员身份运行

  输入命令：set-ExecutionPolicy RemoteSigned 然后回车
  选择：输入A选择全是，或者输入Y选择是 都可以的
  接着重新启动然后去运行就可以了

  

  

  

  2.将打包好的dist文件夹放进了虚拟机vue1文件夹

  

  3.进入nginx.conf文件夹

  cd /usr/local/nginx/conf

  4.编辑配置文件

  vi nginx.conf

  

  保存后退出

  5.重新加载配置文件

  ./nginx -c /usr/local/nginx/conf/nginx.conf

  

  查看进程

  

  关闭多的进程

  

  再次刷新

  ./nginx -c /usr/local/nginx/conf/nginx.conf

  然后访问浏览器，在这里遇到了 页面404notfound 的问题

  原因是编辑配置文件时 路径 有问题，建议大家到虚拟机中文件路径复制后再粘贴到配置文件中，减少一些不必要的错误。

  重新编辑配置文件，再重复一遍上述操作（记得一定要刷新哦）就OK啦

  6.浏览器访问IP地址，就可以成功进入界面啦。