Nginx部署两个vue项目

本文介绍了如何在Nginx服务器上部署两个Vue项目,通过配置Nginx的server块,实现了不同URL路径对应不同的Vue项目。主域名www.url.com下,根路径 '/' 显示第一个项目,子域名 '/two' 显示第二个项目。详细步骤包括修改Nginx配置文件,调整Vue项目的publicPath和router.base,以及打包和启动Nginx。
摘要由CSDN通过智能技术生成

公司要求一个URL下连接两个项目,查阅了半天了解到nginx,研究了研究终于搞定了,记录一下过程,方便以后温习。

线上nginx搭建是后台写的,开发环境是前端(也就是我)写的,所以文章是以前端角度描述的。

首先主域名是www.url.com,要绑定的子域名是www.url.com/two(two是第二个项目的名字)

第一个项目默认为根url,'/' 就自动选择第一个项目,第二个项目为 '/two' , url输入www.url.com/自动选择第一个项目,url输入www.url.com/two自动选择第二个项目。

先下载nginx,找到nginx.conf文件,修改配置

server {
        listen       8080;
        server_name  localhost;
 
        #charset koi8-r;
 
        #access_log  logs/host.access.log  main;
 
        location / {
            root   第一个项目的本地路径;
            index  index.html index.htm; //默认选择的页面
            try_files $uri $uri/ /index.html;//刷新跳转的页面,防止404
        }
         location /two{
            alias   第二个项目的本地路径;
            index  index.html ind

评论 1
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值