当前位置: 首页 > news >正文

linux 使用nginx部署vue、react项目

前言

本文基于:操作系统 CentOS Stream 8
使用工具:Xshell8、Xftp8

服务器基础环境:

  • node - 请查看 linux 安装node并全局可用

所需服务器基础环境,请根据提示进行下载、安装。

1.安装依赖

安装gcc、gcc-c++

yum install gcc gcc-c++ -y

安装pcre、pcre-devel

yum install pcre pcre-devel -y

安装zlib、zlib-devel

yum install zlib zlib-devel -y

安装openssl、openssl-devel

yum install openssl openssl-devel -y

在这里插入图片描述

2.下载 nginx 并解压

在 /usr/local 目录下,新建 nginx 文件夹并进入

cd /usr/local && mkdir nginx && cd ./nginx

在这里插入图片描述

下载压缩包

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

说明

  • nginx 版本可以自定义,后续步骤需对应修改

在这里插入图片描述

解压

tar -zxvf nginx-1.19.10.tar.gz

在这里插入图片描述

在这里插入图片描述

3.安装 nginx 模块并编译

cd nginx-1.19.10
./configure --prefix=/usr/local/nginx

说明

  • –prefix:指定 nginx 的安装路径(默认安装在 /usr/local/bin)
  • 如需安装 https 模块:./configure --prefix=/usr/local/nginx --with-http_ssl_module
  • 如需安装 gizp 模块:./configure --prefix=/usr/local/nginx --with-http_gzip_static_module

在这里插入图片描述

编译并安装

make && make install

说明

  • 如果提示 -bash: make: command not found,执行 yum install make -y 即可

在这里插入图片描述

在这里插入图片描述

4.配置 nginx.conf 文件

进入 /usr/local/nginx/conf 目录,找到 nginx.conf 文件,右键选择记事本编辑,修改并保存

server {listen       80;server_name  localhost;location / {root   /var/www/project;index  index.html index.htm;try_files $uri $uri/ /index.html;}
}

说明

  • listen:服务器端口,如果不是80端口,需配置安全组
  • server_name:域名,没有的话通过公网IP访问即可
  • location - root:前端打包文件存放路径

在这里插入图片描述

在这里插入图片描述

5.上传打包文件

根据 nginx.conf 配置,将前端打包文件上传至对应文件夹

在这里插入图片描述

6.启动 nginx

cd /usr/local/nginx/sbin
./nginx

在这里插入图片描述

其他常用命令

重启

./nginx -s reload

关闭

./nginx -s stop

7.效果图

在这里插入图片描述

如果本篇文章对你有帮助的话,很高兴能够帮助上你。

当然,如果你觉得文章有什么让你觉得不合理、或者有更简单的实现方法又或者有理解不来的地方,希望你在看到之后能够在评论里指出来,我会在看到之后尽快的回复你。

相关文章:

  • 人脑、深思考大模型与其他大模型的区别科普
  • Mac搭建Flutter IOS环境详细指南
  • Flutter 学习之旅 之 Flutter 和 Android 原生 实现数据交互的MethodChanel和EventChannel方式的简单整理
  • Transformer数学推导——Q27 证明时序注意力(Temporal Attention)在视频模型中的帧间依赖建模
  • 因特网和万维网
  • 游戏打击感实现
  • Day8 鼠标控制与32位模式切换
  • 配置管理平台Nacos01:基础安装教程和启动运行
  • 软件测试深度解析:从“用户登录“看测试用例设计的艺术
  • 零基础搭建AI作曲工具:基于Magenta/TensorFlow的交互式音乐生成系统
  • 复现:Mamba-UNet:降水临近预报的创新解决方案
  • 如何搭建spark yarn 模式的集群
  • [ 问题解决 ] sqlite3.ProgrammingError: SQLite objects created in a thread can ...
  • 38、Python协程与任务调度高级技巧:从异步IO到分布式实践
  • (001)Excel 快捷键
  • 云原生开发革命:iVX 如何实现 “资源即插即用” 的弹性架构?
  • 将python程序创建成可以在扣子中运行的插件
  • 将本地Springboot项目部署到Linux服务器
  • Vscode无法与远程服务器建立连接:connecting with ssh timed out
  • 处理对象集合,输出Map<String, Map<String, List<MyObject>>>格式数据,无序组合键处理方法
  • 10台核电新机组获核准,上海核电厂商独揽超500亿元订单
  • 中共中央、国务院关于表彰全国劳动模范和先进工作者的决定
  • 安阳一村支书微信群骂村民被警方行拘,辩称对方先“污蔑造谣”
  • 国家发展改革委:我们对实现今年经济社会发展目标任务充满信心
  • 五一假期“热潮”来袭,计划南下的小伙伴注意了
  • 知名计算机专家、浙江大学教授张森逝世