同域名下两个vue项目互相跳转

最新推荐文章于 2024-04-07 16:19:42 发布
最新推荐文章于 2024-04-07 16:19:42 发布
阅读量2.8k 收藏 10
点赞数 1
分类专栏： vue js
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/wanshiwusanren/article/details/117810095
版权
vue 同时被 2 个专栏收录
14 篇文章 0 订阅
订阅专栏
js
6 篇文章 0 订阅
订阅专栏

下载nginx，下载后找到conf里的nginx.conf文件，拖到编辑工具中
然后更改对应的端口号
在这里插入图片描述

然后把打包好的两个项目放到html文件夹中（只放dist文件夹中的内容即可）
在这里插入图片描述
配置好后，然后双击nginx.exe启动服务
在这里插入图片描述
打开网站：直接再浏览器输入localhost:8080/map或者localhost:8080/houtai即可
在这里插入图片描述

然后再需要跳转的地方直接跳转就行
window.location.href = "http://localhost:8080/houtai/#/home"
在这里插入图片描述

~万事屋
关注
  • 1
    点赞
  • 踩
  • 10
    收藏
    觉得还不错? 一键收藏
  • 3
    评论
专栏目录
解决vue打包项目后刷新404的问题
11-26
- `/index.html`：如果前两个都找不到，就返回`index.html`，Vue应用会处理路由跳转。 - `=404`：如果所有尝试都失败，才真正返回404错误。 通过这样的配置，Nginx会将所有的请求都重定向到`index.html`，然后Vue...
vue项目加按钮，两个不同的项目当前页进行互相切换
weixin_43703816的博客
07-26 417
vue项目加按钮，两个不同的项目当前页进行互相切换
vue毫无关系的两个页面之间的调用
tyjlearning的博客
07-28 2401
vue毫无关系的两个页面之间的调用
两个Vue项目 如何跳转
qq_37875903的博客
07-30 6079
两个不同的项目跳转的话使用window.location.href就可以了，写了一个小组件供参考： <template> <div @click="jumpToNewProject">跳转到新的vue项目</div> </template> <script> export default { name: "Jump", methods: { jumpToNewProject: function () {
vue实现多页面应用开发,包含项目之间跳转
weixin_64141611的博客
07-30 4288
需求：在一个vue项目工程下，需要部署两个项目甚至多个项目。 实现思路： 第一步：在vue.config.js文件中配置两个项目的入口
nginx 配置多个vue，环境部署
lddzyh的博客
01-01 2905
1、最近项目要上线，需要通过nginx作为代理，要发布2个VUE前端项目，记录一下nginx.conf配置文件,
vue二个没有关系的页面，实现相互调用
ZhouHuiCSDN
06-08 2017
vue二个没有关系的页面，实现相互调用
spingboot+vue前后端分离项目人员管理系统
09-25
接下来，我们将深入探讨这两个技术栈在该项目中的应用。 ### SpringBoot后端开发 SpringBoot是Spring框架的一个子项目，它简化了Spring应用的初始搭建以及开发过程。在人员管理系统中，SpringBoot主要负责数据处理...
解决vue中使用proxy配置不同端口和ip接口问题
12-01
首先，打开`vue.config.js`文件，如果没有这个文件，可以在项目的根目录下创建它。然后添加以下配置： ```javascript module.exports = { publicPath: process.env.NODE_ENV === 'production' ? './' : '/', dev...
根据邮箱的域名跳转到相应的登录页面的代码
09-05
6. JavaScript 字符串操作：在代码中，我们使用了 `split()` 方法来将邮箱地址分割成两个部分：用户名和域名。这展示了 JavaScript 字符串操作的概念和使用方法。 7. JavaScript 条件语句：在代码中，我们使用了 `...
毕设项目：基于SpringBoot+Vue前后端分离型图书管理系统.zip
08-15
这是一个基于Spring Boot和Vue.js开发的前后端分离型图书管理系统的毕设项目。Spring Boot是Java领域的一个热门框架，...通过实践，你可以深入了解这两个框架的协同工作方式，以及如何构建高效、可维护的Web应用程序。
nginx路径跳转 访问不同vue项目
weixin_43090627的博客
06-02 2647
现已搭建两个vue项目分别为项目A和项目B； 两个项目的ip地址是： http://192.168.1.1:10123; http://192.168.1.1:10124; 想在一个域名中通过路径修改实现不同项目的跳转；例如输入/foo/ 对应第一个项目，/bar/对应第二个项目。 nginx配置如下： server { listen 9000; server_name localhost; location /foo/ { proxy_
Nginx 部署多个vue项目
zyyy930的专栏
03-31 513
nginx 下部署多个vue项目。
vue怎么调用另一个vue的方法
wgx_0504的博客
07-17 5947
访问另一个组件的实例，并调用其方法。记得给另一个组件设置一个。属性来获取另一个组件的实例，并通过这个实例来调用其方法。通过这种方式，你可以在一个Vue组件中通过。属性，以便在当前组件中引用它。在一个Vue组件中定义一个。一种常见的方法是使用。
外部链接和VUE项目互相跳转实现退出登录
中老年程序员
08-28 763
外部链接直接跳转到vue项目，vue项目的createRouter总是会人为的给链接路由换成/home。如果是直接用vue项目默认路由 #/home/再带其他参数跳转过去，vue项目不会再去把路由全部替换成/home，这时候后面再加自己的路由loginout和参数啥的就没问题了，顶多在router.beforeEach拦截路由的时候判断一下loginout，to.fullPath.indexOf("loginout")>0，来执控制他不执行跳转到别处。
单点登录：两个不同域名Vue项目相互跳转并且传递Token
最新发布
qq_54065476的博客
04-07 2356
前端实现SSO
Vue的几种跳转页面的方式
weixin_61738415的博客
04-19 1397
vue跳转方式
从A项目跳转到B项目，Vue两个不同项目之间实现跳转
qq_37635012的博客
04-01 537
这里的window.g.BackUrl是我们在B项目的public下的config.js里对跳回地址进行设置的值，也就是在B项目代码config.js里写上A项目的访问地址，方便调用，然后这里homePage也是A项目的首页路由地址，这样就实现了从B项目跳回A项目。最近遇到一个需求，就是有两个不同的项目，姑且叫项目A与项目B吧，前端技术栈都是Vue,现在登录成功A项目后希望点击A项目里某个按钮可以跳转到B项目里的某个页面，然后点击B项目里某个按钮可以跳回到A项目里的某个页面。
多个vue项目之间跳转_好程序员Web前端干货详解Vue-Router路由与配置
weixin_39731807的博客
11-23 1083
好程序员Web前端干货详解Vue-Router路由与配置，现在的很多应用都流行SPA应用(singe page application) 。传统的项目大多使用多页面结构，需要切换内容的时候我们往往会进行单个html文件的跳转，这个时候因受到网络、性能的影响，浏览器会出现不定时间的空白界面，用户体验不好。而单页应用则是用户通过某些操作更改地址栏url之后，动态的进行不同模板内容的无刷新切换，用户体验...
一个域名两个vue项目
06-03
是可以的，但需要注意以下几个问题： 1. 域名解析：需要将该域名解析到服务器的 IP 地址上。 2. 端口号：如果两个 Vue 项目都使用了默认的 80 端口，那么只能有一个项目正常运行。因此，需要将其中一个项目的端口号修改为其他值。 3. 路由配置：需要根据不同的路径访问不同的 Vue 项目。可以在服务器端进行路由配置，或者使用 Nginx 等反向代理服务器进行配置。 总之，要在一个域名下运行多个 Vue 项目，需要进行一些额外的配置。建议在部署前先进行测试，确保所有配置都正确无误。
评论 3
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明：

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

余额充值