Nginx 部署vue项目

已于 2022-04-21 15:52:41 修改
阅读量3.2k 收藏 3
点赞数
文章标签： nginx vue
于 2022-04-21 15:50:13 首次发布
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/m0_55588226/article/details/124323089
版权
本文详细介绍了如何在Linux环境下部署Vue项目，包括下载Nginx、上传文件、安装服务器、上传Vue项目到服务器根目录，并修改配置文件及重启Nginx进行测试。
摘要由CSDN通过智能技术生成

文章目录

nginx 部署vue项目

1.下载nginx

nginx下载地址
选择此版本的nginx，如下图所示：
在这里插入图片描述

2.把下载好的文件上传至Liunx目录

我放在了/usr/local/目录下
解压此文件：

tar -xvf nginx-1.21.6.tar.gz

3.安装nginx服务器

在解压出来的文件夹nginx-1.21.6根目录中执行如下命令
1.首先安装nginx依赖项

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

2.执行命令

./configure

3.在nginx-1.21.6目录下执行命令

make

make install

3.安装之后

1.查找工作目录命令

whereis nginx

最低0.47元/天 解锁文章
多喝热水i000
关注
Nginx部署一个vue项目
上海市市花的博客
08-09 1万+
第一步:将项目打包 demo地址:https://github.com/RenlyWen/vue-init.git 终端输入命令: cnpm install && npm run build 之后会生成一个dist文件夹 第二步:配置Nginx 修改server-location路径 worker_processes 1; # 以上是全局模块 # worker_processes的值越大,Nginx并发能力越强 events { worker_con...
Nginx部署vue项目
m0_67391683的博客
08-02 9115
先自我介绍一下，小编13年上师交大毕业，曾经在小公司待过，去过华为OPPO等大厂，18年进入阿里，直到现在。深知大多数初中级java工程师，想要升技能，往往是需要自己摸索成长或是报班学习，但对于培训机构动则近万元的学费，着实压力不小。因此我收集了一份《java开发全套学习资料》送给大家，初衷也很简单，就是希望帮助到想自学又不知道该从何学起的朋友，同时减轻大家的负担。将打包生成的dist文件夹内文件，放到nginx的安装包下，html文件夹中。这时可以看到生成dist文件夹，我们要放在服务器上的文件就在这，.
Nginx部署Vue项目
Fanger_travel的博客
03-01 3303
root>：项目存放目录（如果只发布一个项目，就是直接把dist拷贝到html文件夹下这种情况，可以直接用html，否则要指定文件夹）如下图，<listen>项为nginx监听的端口，默认是80。（5）打开浏览器，输入网址：http://localhost:9528（假设配置文件中端口修改成9528）完成上一步后，打开我们的配置文件<nginx.conf>，找到<server>节点，修改参数。②打开cmd，cd切换到nginx所在文件夹下，输入命令：start nginx，回车。包解压后会得到如下目录。
Nginx 部署 Vue 指南
最新发布
qq_64272546的博客
08-30 1626
为了提高安全性，建议为你的站点配置 HTTPS。但是因为环境或者其他的什么原因，每个人的部署情况可能都会不同，具体情况具体分析，欢迎大家分享自己遇到的问题。如果你的服务器启用了防火墙，确保允许 HTTP 流量通过。在 Nginx 的配置目录中创建一个新的配置文件。现在，你应该能够通过浏览器访问你的域名或 IP 地址来查看部署的 Vue 应用。将构建好的 Vue 项目文件复制到 Nginx 配置中指定的根目录。替换为你的域名或服务器的 IP 地址，并将。替换为你的 Vue 项目的构建目录路径。
nginx部署vue项目
weixin_45820270的博客
06-17 2439
nginx部署vue项目
nginx 部署 vue 项目找不到js css文件的解决方法
09-29
在使用nginx部署Vue项目时，有时候会遇到找不到JavaScript和CSS文件的问题。这主要是因为Webpack在构建过程中生成的静态资源引用路径不正确。本文将详细介绍解决这一问题的方法，主要包括vue-cli@3的配置方式和vue-...
在Docker中使用Nginx部署Vue项目
什么都干的派森
04-18 5590
文章目录一、前置需求1.liunx环境2.安装Docker二、部署方法1.打包Vue项目2.Docker拉取Nginx镜像3.创建一个打包镜像的目录4.上传Vue项目5.编写Nginx配置文件6.编写Dockerfile7.创建镜像8.启动容器三、访问测试 一、前置需求 1.liunx环境 本人用的 Centos7 2.安装Docker 参考这篇文章 https://blog.csdn.net/weixin_43721000/article/details/124237932 二、部署方法 1.打包Vu
nginx 部署vue项目
weixin_39255905的博客
06-12 1043
nginx 部署vue 项目
Nginx中配置vue，react项目地址
dc1339485的博客
11-28 170
如题 像以前在Nginx中配置域名解析的时候只需要在conf.d文件夹下添加对应的xx.conf文件(当然了你也可以在nginx.conf)下配置。 如果是以前的老项目只需要在配置文件中server内配置root直接设置需要访问的地址目录，index中配置首页页面。最后nginx -s reload重启Nginx。 但是现在前端项目大都是webpack打包后编译的结果，压根就...
【Nginx】部署vue项目
不知道在干嘛每天
12-10 530
Nginx安装 点击下面参考链接——>centOS7安装nginx及nginx配置 安装完成之后，进入nginx目录，路径如下 /usr/local/nginx 主要使用到的有三个目录： conf：nginx配置文件的目录 html：项目打包文件存放的目录 sbin：Nginx启停的目录 conf conf目录里面主要用到两个文件 cert：给域名配置ssl证书时，存放key的目录，ssl证书的配置，在阿里云、华为云等等都有说明。 nginx.conf：nginx服务配置的文件 html 这里
使用 Nginx 部署 Vue 项目
asing1elife's blog
05-31 803
Vue 项目在 build 之后通常都需要部署到服务器才能够访问，本文介绍如果使用 Nginx 部署 Vue 项目 更多精彩 更多技术博客，请移步 IT人才终生实训与职业进阶平台 - 实训在线 首先需要说明可能存在的误区 我这个项目是使用的 Vue + SpringBoot 实现前后分离的项目 也就是说在部署时，前端和后端要分别单独部署，前端通过请求后端的接口还实现数据交互 一开始我是打...
nginx部署Vue项目
等风来的博客
11-05 404
nginx部署Vue项目
nginx部署VUE项目
小白变怪兽
04-19 1017
目前公司的前端代码基本都是部署在nginx下，特此来记录一下开发环境：window10。
nginx 部署vue 项目
qq_33285313的博客
07-15 244
在vue 项目中修改上边三个文件 在nginx 中做以上配置 location /dmc { #rewrite .* /dmc/index.html break; root /usr/local/nginx/html; #编译vue 出来的文件放置的地方 index index.html index.htm; try_files $uri $uri/ @dmc_route...
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

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

余额充值