qiankun 主子应用使用同一地址同一端口配置

参考官网配置链接:https://qiankun.umijs.org/zh/cookbook#%E5%9C%BA%E6%99%AF-1%E4%B8%BB%E5%BA%94%E7%94%A8%E5%92%8C%E5%BE%AE%E5%BA%94%E7%94%A8%E9%83%A8%E7%BD%B2%E5%88%B0%E5%90%8C%E4%B8%80%E4%B8%AA%E6%9C%8D%E5%8A%A1%E5%99%A8%E5%90%8C%E4%B8%80%E4%B8%AA-ip-%E5%92%8C%E7%AB%AF%E5%8F%A3

报错信息:Unceugnt Error: application "xxxx’ died in status LOADING_SOURCE_CODE: [qiankun]: You need to export lifecycle functions
in xxxx entry

一、主应用注册子应用部分重点内容

  • entry 子应用入口,子应用的publicPath(打包用)、base(匹配路由)需和该地址保持一致
  • activeRule子应用的真实访问地址(不能和entry一样,要不然主应用刷新的时候,就会直接进入子应用)

main.js

registerMicroApps([
// 子应用{name: 'child-app', // 子应用的名称entry: '/child-appEntry/', // 子应用入口,子应用的publicPath(打包用)、base(匹配路由)需和该地址保持一致// entry:  'http://localhost:8080/child/vue-hash/', // 指向本地子应用的时候改成本地子应用的启动地址container: '#container', // 主应用给子应用提供的容器activeRule: '/subApp', // 子应用的真实访问地址(不能和entry一样,要不然主应用刷新的时候,就会直接进入子应用)},
])

二、子应用(vue2.0)

vue.config.js

module.exports = {...publicPath: "/child-appEntry/",outputDir: "child-app", // 打包名称,nginx匹配...
}

router.js

let Router = new VueRouter({mode: "history",base: "/child-appEntry/",...
})

三、ngnix配置1

// 后端微服务网关
location ^~ /api/ {proxy_pass_header Serve;proxy_ignore_client_abort on;proxy_redirect off;proxy set header X-Real-lP $remote addr;proxy set header X-Scheme $scheme;add header Access-Control-Allow-Origin *;add header Access-Control-Allow-Headers X-Requested-With;add header Access-Control-Allow-Methods GET,POST.OPTIONS;proxy pass http://xxx.xxx.xx.x:8888;
}// 路由匹配
location / {root htmlindex index.html index.htmtry_files $uri $uri/ /index.html
}
location /child-appEntry/ {root htmlindex index.html index.htmtry_files $uri $uri/ /child-app/index.html
}

nginx部署目录
在这里插入图片描述

四、nginx配置2(服务器配置)

location / {root /home/nginx/nginx/html/mainindex index.html index.htmtry_files $uri $uri/ /index.html
}
location /child-appEntry/ {root htmlindex index.html index.htmtry_files $uri $uri/ /child-app/index.html
}

nginx部署目录
在这里插入图片描述

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/news/804279.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

【Java网络编程】IP网络协议与TCP、UDP网络传输层协议

1.1、IP协议 当应用层的数据被封装后,想要将数据在网络上传输,数据究竟要被发往何处,又该如何精准的在网络上定位目标机器,此时起到关键作用的就是“IP协议”。IP协议的作用在于把各种数据包准确无误的传递给目标方,其…

微信小程序用户登录授权指定(旧版本)

配置旧版本基础库2.12.3 实现效果 点击登录按钮即可直接登录&#xff0c;获取用户昵称和头像 点击获取头像昵称按钮则需要授权&#xff0c;才能成功登录 代码实现 my.xml <!-- 登录页面,调试基础库为2.20.2库 --> <view class"mylogin"><block w…

B02、分析GC日志-6.3

1、相关GC日志参数 -verbose:gc 输出gc日志信息&#xff0c;默认输出到标准输出-XX:PrintGC 输出GC日志。类似&#xff1a;-verbose:gc-XX:PrintGCDetails 在发生垃圾回收时打印内存回收详细的日志&#xff0c; 并在进程退出时输出当前内存各区域分配情况-XX:PrintGCTimeStamp…

Selenium——基于Web的UI自动化测试工具(一)

一、selenium简介 Selenium是一个自动化测试工具&#xff0c;用于模拟用户在Web上的行为。它支持多种浏览器&#xff0c;如Chrome、Firefox、IE等。Selenium可以实现多种操作&#xff0c;包括打开浏览器、导航到指定URL、填写表单、点击按钮、获取页面元素等。 Seleniu…

简单使用Linux printf 将十进制转换为十六进制

在开发和排查问题过程中&#xff0c;有时我们需要做一些进制的转换&#xff0c;以下是一些快速的小技巧&#xff1a; 下面的是 十进制转换为十六进制&#xff1a; ❯ printf "0x%x\n" 100 0x64 还可以把 十六进制转为十进制&#xff1a; ❯ printf "%d\n&q…

flutter性能优化总结

Flutter应用程序默认已经具有良好的性能&#xff0c;因此您只需要避免常见的陷阱&#xff0c;就可以获得出色的性能。 流畅度(提高渲染性能) 控制build()方法的耗时 避免在 build() 方法中进行重复且耗时的工作&#xff0c;因为当父 widget 重建时&#xff0c;子 Wdiget 的 b…

XILINX 7系列时钟资源

文章目录 前言一、时钟概要1.1、CC1.2、BUFR、BUFIO、BUFMR1.3、CMT1.4、BUFH1.5、BUFG 二、时钟路由资源三、CMT 前言 本文主要参考xilinx手册ug472 一、时钟概要 7系列FPGA时钟资源主要有CC、BUFR、BUFIO、BUFMR、CMT、BUFG、BUFH和GTE_COMMON 1.1、CC “CC”&#xff0…

代码签名证书是什么?软件签名证书功能和分类

代码签名证书是什么&#xff1f;代码签名证书&#xff08;Code Signing Certificate&#xff09;是用于对可执行文件或脚本&#xff0c;软件代码等进行数字签名&#xff0c;可验证软件发布者身份、保证软件签名后未被篡改&#xff0c;以此验证开发者身份的真实性和保护代码的完…

【QT】Qt Charts的实际使用中的一些小细节完善如:resetZoom、fitInView

在Qt中&#xff0c; 使用 Qt Charts来创建和操作图表&#xff0c;重置图表缩放状态的功能可以通过调整图表视图的缩放比例来实现。Qt Charts中的QChartView提供了相关的方法来控制图表的缩放和平移。 示例代码&#xff0c;以及如何对此功能进行扩展&#xff1a; #include <…

Go —— GMP面试题

前言 关于GMP的详细讲解请移步&#xff1a;Go —— 协程 简单介绍一下Go的GMP调度模型 0&#xff09;G&#xff1a;协程&#xff0c;M&#xff1a;系统线程&#xff0c;P&#xff1a;协程调度器 1&#xff09;通过go func() 生成一个 G 2&#xff09;G会优先放到P的本地队…

C++_List的学习

1.概述 1. list 是可以在常数范围内在任意位置进行插入和删除的序列式容器&#xff0c;并且该容器可以前后双向迭代 2. list 的底层是双向链表结构&#xff0c;双向链表中每个元素存储在互不相关的独立节点中&#xff0c;在节点中通过指针指向其前一个元素和后一个元素 3. list…

运营商名称 是如何显示到 手机通知栏上的?

在我们日常使用手机的过程中&#xff0c;经常会在通知栏或设置菜单中看到特定的运营商名称&#xff0c;例如"中国移动"、"中国联通"或"中国电信"等。 那么&#xff0c;这些运营商的名称是如何出现在我们手机上的呢&#xff1f;手机又是如何区分不…

软信天成:如何通过5个步骤获得高层对主数据管理项目的支持

如今&#xff0c;全球各地的组织正在采用主数据管理&#xff08;MDM&#xff09;以应对日益严峻的数据问题。然而&#xff0c;成功地实现 MDM 项目并非易事&#xff0c;这需要得到高层的全力支持。下面&#xff0c;软信天成将详细介绍五步策略&#xff0c;协助您获得高层对MDM项…

连接mysql或mariaDB报错:is not allowed to connect to this MariaDB server

1.报错信息&#xff1a;Host ‘192.168.3.91’ is not allowed to connect to this MariaDB server 2.报错原因&#xff1a;因为没有远程连接数据库的权限 一般为新创建数据库或新创建的用户没有远程连接数据库的权限&#xff0c;需要进行授权 # mysql -u root -p # use mysql…

属于我们Go语言的toString!

在 Go 语言中&#xff0c;类似于 Java 中的 toString() 方法&#xff0c;可以通过实现 String() 方法来自定义类型的字符串表示形式。这种机制使得在打印自定义类型的值时能够输出更加可读性高的字符串。在本文中&#xff0c;我们将探讨如何在 Go 中实现类似的功能&#xff0c;…

SCI一区 | Matlab实现OOA-TCN-BiGRU-Attention鱼鹰算法优化时间卷积双向门控循环单元融合注意力机制多变量时间序列预测

SCI一区 | Matlab实现OOA-TCN-BiGRU-Attention鱼鹰算法优化时间卷积双向门控循环单元融合注意力机制多变量时间序列预测 目录 SCI一区 | Matlab实现OOA-TCN-BiGRU-Attention鱼鹰算法优化时间卷积双向门控循环单元融合注意力机制多变量时间序列预测预测效果基本介绍模型描述程序…

基于springboot实现常州地方旅游管理系统项目【项目源码+论文说明】计算机毕业设计

基于springboot实现旅游管理系统演示 摘要 随着旅游业的迅速发展&#xff0c;传统的旅游信息查询方式&#xff0c;已经无法满足用户需求&#xff0c;因此&#xff0c;结合计算机技术的优势和普及&#xff0c;针对常州旅游&#xff0c;特开发了本基于Bootstrap的常州地方旅游管…

Python2.7和Python3.6共存的环境中,如何使用 Python 3.6 的 pip 安装其他包(如scikit-learn)

在开发环境中同时安装多个 Python 版本是一种常见的情况&#xff0c;本文将介绍在Python2.7和Python3.6共存的环境中&#xff0c;如何使用 Python 3.6 的 pip 安装其他包&#xff08;如scikit-learn&#xff09;。 步骤&#xff1a; 确定 Python 3.6 的 pip 路径&#xff1a; …

MacOS初识SIP——解决快捷指令sh脚本报错Operation not permitted

前言 因为一些原因&#xff0c;设计了一套快捷指令&#xff0c;中间涉及到一个sh脚本的运行&#xff0c;通过快捷指令运行时就会报错&#xff1a;operation not permitted 奇怪的是在快捷指令窗口下运行一切正常&#xff0c;但是从其他地方直接调用&#xff0c;例如通过Comma…

WebGL入门

WebGL采用HTML5中新引入的<canvas>元素(标签),它定义了网页上的绘图区域。 1、Canvas是什么 在HTML5出现之前,如果你想在网页上显示图像,只能使用HTML提供的原生方案<img>标签。用这个标签显示图像虽然简单,但只能显示静态的图片,不能进行实时绘制和渲染。…