nginx部署vue项目的步骤

最新推荐文章于 2024-05-17 12:58:20 发布
最新推荐文章于 2024-05-17 12:58:20 发布
阅读量830 收藏 1
点赞数
文章标签： nginx 前端 运维
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/qq_30434271/article/details/127307927
版权

1. 下载nginx

nginx下载地址

2.npm run build 打包vue项目

 

3. 找到打包好的资源，一般在项目路径/dist的目录下，copy全量资源到nginx的html目录下

 

4.修改nginx的conf目录下的 nginx.conf文件内容（这里的host变量，不知道为什么本地部署时，一定要指定服务端host域名才可以访问到，否则会接口404）

 5.启动nginx，通过localhost:端口访问即可

安之若素^
关注
  • 0
    点赞
  • 踩
  • 1
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
nginx部署多个vue项目的方法示例
11-19
上一篇已经介绍了然后配置web项目；今天由于公司需求，需要在同一域名端口下，部署两个项目；今天花了一上午终于弄好了，选择赶紧做一个笔记。 如何连接阿里云服务器就不在这里说了，请看我以前的文章。 首先需要的效果 http://47.97.244.83/login http://47.97.244.83/student/login 文件目录 两个项目并列在同一文件夹内。 准备好两个vue的项目 http://47.97.244.83/login：这个不用修改配置直接build就可以。关键是二级域名的vue项目，需要进行一下修改。 首先在config文件夹内的index.js内修改(注意是b
nginx部署vue项目
PhilsphyPrgram的博客
07-14 1万+
windows的nginx部署vue项目
Vue项目部署到Nginx服务器
最新发布
极限突破者的博客
05-17 741
本文将详细介绍如何将Vue前端项目部署到Nginx服务器。Nginx是一款开源的高性能HTTP服务器和反向代理服务器。
Vue项目部署（Nginx）
weixin_42067873的博客
09-05 1万+
vue项目部署
手把手教 Nginx 部署 Vue 项目
csdn_life18的博客
08-06 2万+
想必大家一定听说过 Nginx，若没听说过它，那么一定听过它的 同行 Apache 吧！Nginx 同 Apache 一样都是一种 Web 服务器。如果你还是对它不够了解，可以自己去深入的学习一下 Nginx 相关的知识，这里不做过多的介绍了，今天我们就来聊聊使用 Nginx 如何来部署我们开发好的前端 Vue 项目。......
Nginx部署vue项目
qq_40501683的博客
01-27 1万+
步骤一：项目打包 打开vscode终端 在终端输入 npm run build 这时可以看到生成dist文件夹，我们要放在服务器上的文件就在这， 步骤二：配置nginx 找到在官网下载的安装包。
nginx下部署vue项目的方法步骤
09-29
主要介绍了nginx下部署vue项目的方法步骤，文中通过示例代码介绍的非常详细，对大家的学习或者工作具有一定的参考学习价值，需要的朋友们下面随着小编来一起学习学习吧
Vue项目部署Nginx配置文件 SSL
08-11
在部署 Vue 项目时，Nginx 配置文件 `nginx.conf` 的关键设置如下： 1. **基本配置**： - `server` 块：定义一个监听特定端口（通常是80）的服务器实例。 ```nginx server { listen 80; server_name your...
nginx部署步骤，vue解决跨域
05-12
vue 跨域解决 Linux上部署nginx
Nginx容器部署Vue项目
Hemameba的博客
06-12 2503
首先需要准备：1.Nginx镜像2.已打包好的Vue项目以上便是如何使用Nginx容器部署Vue项目的具体方法，简单来讲就是将容器的目录映射到宿主机上，然后在宿主机上存入代码，修改配置文件，重启容器便可完成部署。
Nginx部署Vue项目
Fanger_travel的博客
03-01 2560
root>：项目存放目录（如果只发布一个项目，就是直接把dist拷贝到html文件夹下这种情况，可以直接用html，否则要指定文件夹）如下图，<listen>项为nginx监听的端口，默认是80。（5）打开浏览器，输入网址：http://localhost:9528（假设配置文件中端口修改成9528）完成上一步后，打开我们的配置文件<nginx.conf>，找到<server>节点，修改参数。②打开cmd，cd切换到nginx所在文件夹下，输入命令：start nginx，回车。包解压后会得到如下目录。
使用Nginx部署Vue项目超详细图文教程！含踩坑步骤！
热门推荐
Viper的程序员修炼手册
03-23 4万+
Nginx部署Vue项目 很多小伙伴在做完Vue项目之后，想要部署到服务器上自己运行试试。其实使用Nginx就可以轻松的做到，并且实现请求转发等功能。下面来看看使用步骤吧。 使用Nignx部署Vue项目步骤 1.打包Vue项目 npm run build 首先使用打包命令打包Vue项目，之后得到一个dist文件夹。这里面存放的是已经打包好的静态资源文件。 注意：这里不同的项目打包的命令可能不一样，具体配置可以在index.js里查看 不同的项目结构不一样哦。我使用的是vue-element-admi
Vue（六） Nginx项目部署
Hello World!
05-26 3654
一.Nginx快速入门 1.Nginx 概述 （1）Nginx 介绍 Nginx 是一个轻量级、高性能的HTTP和反向代理web服务器 （2）Nginx 功能 2.Nginx 安装与控制 （1）Nginx Linux安装 （2）Nginx 控制指令 3.Nginx 目录结构分析与配置说明 （1）Nginx 文件目录结构分析 （2）Nginx 配置说明 4.Nginx 功能实现解决方案 二.Vue项目部署（Nginx） .....................
nginx - 使用nginx部署vue项目到本地以及代理和负载均衡
qq_43886365的博客
09-29 8980
使用nginx部署vue项目到本地以及代理和负载均衡
nginx部署vue项目（包括一个nginx部署多个vue项目）
guoyp2126的博客
09-17 9351
在nginx部署vue项目，含同一端口号下，配置多个vue项目
centos7 使用Nginx部署vue项目步骤
05-14
以下是在 CentOS 7 上使用 Nginx 部署 Vue 项目的步骤： 1. 安装 Nginx ```shell sudo yum install nginx ``` 2. 配置 Nginx 进入 Nginx 配置目录： ```shell cd /etc/nginx/conf.d ``` 创建一个新的配置文件...

“相关推荐”对你有帮助么？

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明：

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

余额充值