微前端框架 qiankun 引入的问题列表

简介: https://juejin.cn/post/7096298938134691854 微前端框架 qiankun 引入的问题列表

初始引入

快速精简入门

解决静态资源问题

创建public-path.js 然后在主入口引入 import './public-path'

if (window.__POWERED_BY_QIANKUN__) {
  __webpack_public_path__ = window.__INJECTED_PUBLIC_PATH_BY_QIANKUN__
}

webpack配置相关 参考地址

output: {
    publicPath: '项目运行路径'
}

解决application '子应用名字' died in status LOADING_SOURCE_CODE: Failed to feath

解决方案需要子应用允许跨域访问开发环境: webpack-devServer配置参考

devServer: {
    headers: {
      'Access-Control-Allow-Origin': '*', // 允许跨域
    },
}

registerMicroApps(apps, lifeCycles?)

接解决给子应用传值

image.png

解决调用子应用时的生命周期用于做一些事情的函数

clipboard.png

start

image.png

qiankun 常见问题列表

传送门

部署问题

开发时不需要一定要放在文件目录下,开发模式下,各应用可单独开发。部署时生产环境,看自己访问地址,是项目都是相同ip端口还是不同ip和端口

根据不同方式部署方式不一样:参考地址

相关文章
|
6天前
|
开发框架 小程序 前端开发
uni-app前端应用开发框架
uni-app对做移动端开发的来说应该无人不知、无人不晓了吧?!从名字就能看出来这个框架要干啥,unify app——没错,就是统一前端应用开发,不管你是小程序、app、还是H5、公众号,用这个框架都能做。uni-app让开发者编写一套代码,就可以编译为安卓app、ios app、微信小程序、抖音小程序、支付宝小程序等十几个平台,而且马上支持纯血鸿蒙了,这简直是个人、开发工作室、小型开发公司的福音,开发一些常规的app、小程序,用这个框架足够了。
19 7
|
4天前
|
前端开发 JavaScript 数据管理
引领潮流:React框架在前端开发中的革新与实践
React,始于2013年,由Facebook驱动,以其组件化、Virtual DOM、单向数据流和Hooks改革前端。组件化拆分UI,提升代码复用;Virtual DOM优化渲染性能;Hooks简化无类组件的状态管理。庞大的生态系统,包括Redux、React Router等库,支持各种需求。例如,`useState` Hook在计数器应用中实现状态更新,展示React的实用性。React现已成为现代Web开发的首选框架。【6月更文挑战第24天】
26 2
|
6天前
|
JSON 前端开发 JavaScript
SSMP整合案例第五步 在前端页面上拿到service层调数据库里的数据后列表
SSMP整合案例第五步 在前端页面上拿到service层调数据库里的数据后列表
14 2
|
13天前
|
开发框架 前端开发 JavaScript
【前端】前端的三大主流框架
【前端】前端的三大主流框架
18 3
|
17天前
|
前端开发 JavaScript 测试技术
web前端语言框架:探索现代前端开发的核心架构
web前端语言框架:探索现代前端开发的核心架构
21 4
|
3天前
|
JavaScript 前端开发
Vue如何使用ELEMENT前端框架,以及其他框架
Vue如何使用ELEMENT前端框架,以及其他框架
|
27天前
|
前端开发 JavaScript API
Vue.js:渐进式JavaScript框架-前端开发
Vue.js:渐进式JavaScript框架-前端开发
24 3
|
26天前
|
前端开发 JavaScript 数据管理
前端框架的发展史&介绍框架特点
前端框架的发展史&介绍框架特点
24 0
前端框架的发展史&介绍框架特点
|
13天前
|
前端开发 JavaScript 安全
Web前端开发中的三大主流框架
Web前端开发中的三大主流框架
|
2月前
|
前端开发 UED 开发者
【Flutter前端技术开发专栏】Flutter中的列表与滚动视图优化
【4月更文挑战第30天】Flutter开发中,优化列表和滚动视图至关重要。本文介绍了几种优化方法:1) 使用`ListView.builder`和`GridView.builder`实现懒加载;2) 复用子组件以减少实例创建;3) 利用`CustomScrollView`和`Slivers`提升滚动性能;4) 通过`NotificationListener`监听滚动事件;5) 使用`KeepAlive`保持列表项状态。掌握这些技巧能提升应用性能和用户体验。
【Flutter前端技术开发专栏】Flutter中的列表与滚动视图优化