Linux nginx 安装 部署运行前端项目

已于 2022-11-19 17:56:20 修改
阅读量1.5k 收藏
点赞数
分类专栏： linux 运维 文章标签： linux nginx 前端
于 2022-11-19 17:50:51 首次发布
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/a755967073/article/details/127939521
版权
本文介绍了如何在Linux上安装Nginx并部署前端项目。首先，讲解了Nginx的基本特性，然后详细阐述了安装过程，包括安装依赖、下载与解压、配置与编译。接着，指导如何配置前端项目，通过修改nginx.conf文件设置前端包路径。最后，验证部署成功的方法是通过浏览器访问IP地址来检查页面能否正常显示。
摘要由CSDN通过智能技术生成

（1）nginx介绍

        Nginx (engine x) 是一个高性能的HTTP和反向代理web服务器 [13]  ，同时也提供了IMAP/POP3/SMTP服务。Nginx是由伊戈尔·赛索耶夫为俄罗斯访问量第二的Rambler.ru站点（俄文：Рамблер）开发的，公开版本1.19.6发布于2020年12月15日。 [11] 

其将源代码以类BSD许可证的形式发布，因它的稳定

最低0.47元/天 解锁文章
小尧没有了
关注
专栏目录
解放运维小哥哥，带你自己上 Linux 部署前端项目
qq_36376434的博客
07-24 1238
本文主要讲不使用 nginx 如何部署前端项目，静态页面和 node 的项目同样适用。下面的介绍中，暂时先没有使用到 jenkins 去进行自动部署，就是自己登录服务器进行操作的步骤。 本文可以让你学到什么 写这篇文章的目的是让新手可以自行登录服务器进行前端项目部署，不需要依赖运维和后端，毕竟大家时间都有限，自力更生很重要。 具体操作步骤 登录服务器 前提是你要有一台可以登录的服务器哦，这个可以和...
Linux中部署前端项目(Nginx服务器)
Que_art的博客
12-10 2162
使用vmware虚拟机，将windows中的前端源码包使用yum安装和源码包安装两种方式，对nginx服务器进行部署使用。
nginx部署前端项目 (Linux版)
最新发布
weixin_43819028的博客
09-04 921
nginx快速部署前端项目，Centos+Nginx+Vue
【linux部署前端项目】
weixin_44357065的博客
07-01 3296
linux前端项目部署
【运维】Linux安装Nginx并部署前端项目【内/外网-保姆级教程】
热门推荐
m0_64210833的博客
06-06 1万+
Linux安装Nginx并部署前端项目的两种方式【内/外网-保姆级教程】
linux环境使用nginx部署前端项目
Xiaofeng_Lu__的博客
05-31 5450
1.linux安装nginx 看这两篇博客： 这个是安装nginx： https://blog.csdn.net/t8116189520/article/details/81909574 这个是将nginx安装到指定目录，如果有这个需求： https://blog.csdn.net/gotheon/article/details/90409492 2.把编译好的dist包放到linux指定的文件夹中 3.修改nginx的配置文件nginx.conf ① 进入安装好的nginx文件夹，找到配置文件
【运维】Linux安装Nginx并部署前端项目的两种方式【内 外网-保姆级教程】_linux部署前端项目
2401_83946826的博客
04-19 452
/3.执行命令:依次执行。//3.执行命令:依次执行。//3.执行命令:依次执行。//2.进入对应文件夹。//2.进入对应文件夹。//2.进入对应文件夹。//1.解压对应文件。//1.解压对应文件。//1.解压对应文件。
Linux如何使用Nginx部署前端项目
m0_67094505的博客
10-27 7425
为了测试同一个网址可能会请求不同服务器，在不同的服务器中部署的是同一个项目，对于用户而言是感知不到的。将项目目录下的config文件夹里的index.js文件中,将build对象下的assetsPublicPath中的“/”，改为“./”后，再打包生成的 dist 文件。5.3、 编辑 /etc/nginx/conf.d/ 路径下的 default.conf 配置文件。Nginx的默认端口号是80，所以在访问项目输入地址的时候是不需要添加端口号进去的。①. HTTP端口，默认8080，如下改为8081。
在Linux上使用nginx部署前端vue项目
weixin_64703215的博客
05-10 1101
由于我在部署这个项目的时候公司要求内网开发，所以不能联网下载nginx的依赖包 需要使用光驱拷贝 链接：https://pan.baidu.com/s/1bXrHV6I0W6yYLo6elhyakA 提取码：9e5w 首先是搭建nginx环境 上面链接是一位大佬提供的网盘资源下载地址 包括nginx（1.13.9）跟环境所需的包。 解压出来后，上传到linux里面，我放在/usr/local/src中（这个路径自己随意放就可以了） 2.进入到你放的nginx整个文件夹所在的位置，我是...
使用nginx部署前端项目（超详细教程）.pdf
04-29
【使用Nginx部署前端项目】的教程是一个详尽的指南，主要面向初学者，旨在教会读者如何利用Nginx高效地部署前端应用。Nginx是一个高性能的Web服务器和反向代理，因其高并发处理能力和低内存占用而受到广泛青睐。 ...
Linux3使用Nginx部署前端项目
weixin_66110079的博客
10-22 2025
Nginx 安装、三个特点：1、负载均衡、动静分离、代理服务的介绍以及实际案例 成功部署前端和后端项目！！！后端部署参考小编的上一篇博客哦！！！
linux环境部署前端项目
qq_40642190的博客
08-20 1512
linux环境部署前端项目 安装node 推荐安装nvm来安装和管理node版本： curl -o- https://raw.githubusercontent.com/nvm-sh/nvm/v0.39.1/install.sh | bashwget -qO- https://raw.githubusercontent.com/nvm-sh/nvm/v0.39.1/install.sh | bash#通过nvm安装node
Linux前端项目启动
qq_43633589的博客
08-12 2482
前提：要安装cpp编译和node 第一步 通过FileZilla Client将打包好的前端项目移动到Linux中，通过unzip命令解压。 第二步 进入到项目根目录 第三步 npm i进行初始化,最后npm run dev(这根据项目package.json启动命令更换) 第四步： 若npm run dev不报错则不需要此步， 当报该错误时(说明没有安装打包工具)： 只需在root权限下执行以下命令即可（安装webpack打包工具即可）： npm install webpack -g npm inst
CentOS7中使用yum安装Nginx的方法
weixin_33704591的博客
11-12 234
最近无意间发现Nginx官方提供了Yum源。因此写个文章记录下。 1、添加源 　　默认情况Centos7中无Nginx的源，最近发现Nginx官网提供了Centos的源地址。因此可以如下执行命令添加源： sudo rpm -Uvh http://nginx.org/packages/centos/7/noarch/RPMS/nginx-release-c...
Linux服务器前端项目的部署
2302_79218791的博客
07-10 1341
记录自己用nginx部署前端项目
【虚拟机】在Linux环境中nginx部署前端项目
qq_73004234的博客
04-19 1233
主要分为3个步骤：在VMware中安装Centos7虚拟机，下载Xshell、Xftp软件（操作非常方便）、Centos7下部署nginx，布置前端项目。
linux部署前端项目
weixin_44177413的博客
04-18 285
若打包文件夹 dist 不在项目根目录，就自行调整，如：app.use(express.static('/sty/dist'))。若打包文件夹 dist 在项目根目录，直接 app.use(express.static('dist')) 就行了；把这个dist文件和server.js通过xftp上传到linux。如果通过ip加端口无法访问需要放行端口号。最后使用node server.js。port 不要与已存在端口冲突。服务器的话需要去防火墙放行端口。再编写一个server.js。
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包

打赏作者

小尧没有了

你的鼓励将是我创作的最大动力

¥1 ¥2 ¥4 ¥6 ¥10 ¥20
扫码支付：¥1
获取中
扫码支付

您的余额不足，请更换扫码支付或充值

打赏作者

实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值