在这篇博文中,我们将探讨如何解决“qiankun 子应用jquery项目”所面临的一系列技术问题。从初始的技术痛点入手,我们会通过各个技术阶段的演进历程来深入分析,并逐步展示我们的架构设计、性能优化策略、故障复盘以及扩展应用的方向。
### 背景定位
我们最初面临的技术痛点是如何在一个不断扩展的前端项目中高效管理多个子应用,尤其是使用 `jquery` 为基础的应用。在这个过程中,我们希望通过
# qiankun jquery子应用
## 简介
qiankun是一个基于single-spa的微前端解决方案,可以用于构建具有插拔能力的主应用和子应用。而jQuery是一个广泛使用的JavaScript库,用于简化HTML文档遍历、操作、事件处理等操作。在这篇文章中,我们将会介绍如何在qiankun子应用中使用jQuery库。
## 安装和配置
首先,我们需要在子应用的项目中安装jQuer
原创
2024-01-23 09:30:17
209阅读
JQuery 是一个兼容多浏览器支持的JavaScript库,其核心理念是write less,do more(写得更少,做得更多),它是轻量级的js库,兼容CSS3还兼容各种浏览器,需要注意的是后续版本将不再支持IE6/7/8浏览器,jQuery使用户能更方便地处理HTML、events、实现动画效果,并且方便地为网站提供AJAX交互,jQuery还有一个比较大的优势是,它的文档说明很全,而且各
转载
2023-11-08 21:07:31
139阅读
我也是看视频学的,在这分享一下源码,qiankun 配置我就不写了,之前分享有dome,下面直接上代码在主应用src下新建 micro-fe文件 micro-fe文件下新建index.js 作为主文件入口import {
rewriteRouter
}
from "./rewrite-router";
import {
handleRouter
}
from "./handle-
转载
2024-09-23 11:32:40
95阅读
说明:本文仅对qiankun.js应用的记载,具体术语请自行搜索。qiankun.js =>qiankun - qiankun一、简介qiankun应用 微前端,之前一直都有简单了解过微服务,大概就是N个类型的服务都注册到主要服务上,然后就各自管理即可。而后期又发展了微服务,前端的微服务简单来说就是,【子应用】(N个站,或者应
转载
2024-09-12 08:37:05
59阅读
一、微前端的优势什么是微前端微前端是一种多个团队通过独立发布功能的方式来共同构建现代化 web 应用的技术手段及方法策略几个核心价值:技术栈无关,独立开发、独立部署,增量升级,独立运行时特点基于single-spa封装,提供了更加开箱即用的 API。HTML Entry 接入方式,让你接入微应用像使用 iframe 一样简单。样式隔离,确保微应用之间样式互相不干扰。JS 沙箱,确保微应用之间 全局
在前文《使用 jQuery Mobile 与 HTML5 开发 Web App —— jQuery Mobile 默认配置与事件基础》中,Kayo 对 jQuery Mobile 事件的基础作出了一些说明,建议在阅读本文前首先阅读前文,这里 Kayo 再引用前文的重要内容。“jQuery Mobile 在基于本地事件上,创建了一系列的自定义事件,大部分事件是基于触摸设备的使用情况开发的,当然这些事
jquery的多页项目,不需要安装依赖,开发阶段也不需要启动本地服务器,直接在浏览器打开,很多情况下用jquery开发还是很方便很快捷的;也会有一些痛点,比如浏览器缓存问题,更新了图片,css或js后,如果引入路径或文件名称不变的话,用户访问的资源可能还是从浏览器缓存获取的旧资源,手动维护文件名称或引入路径又很麻烦,这就需要引入webpack了webpack4 安装依赖package.json"d
转载
2023-07-17 10:33:05
217阅读
# qiankun加载jquery项目
随着前端开发的不断发展,微前端成为了一个热门话题。qiankun 是一个开源的微前端框架,可以帮助我们将多个独立的前端项目整合到一个页面中。本文将介绍如何使用 qiankun 加载一个基于 jQuery 的子项目。
## 1. 准备工作
首先,我们需要创建一个基于 jQuery 的子项目。可以使用如下代码创建一个简单的项目:
```html
原创
2024-06-10 04:24:06
131阅读
# jQuery项目集成Qiankun的探索之旅
随着微前端架构的兴起,越来越多的项目选择将多种技术栈云集于同一个页面中。Qiankun作为一个流行的微前端框架,它允许开发者灵活地集成不同的前端技术。在这篇文章中,我们将探讨如何将 jQuery 项目与 Qiankun 集成,通过一些简单的代码示例来实现这一目标。
## 什么是Qiankun?
Qiankun是一个基于 Single SPA
一.什么是micro-app微前端的概念是由ThoughtWorks在2016年提出的,它借鉴了微服务的架构理念,核心在于将一个庞大的前端应用拆分成多个独立灵活的小型应用,每个应用都可以独立开发、独立运行、独立部署,再将这些小型应用融合为一个完整的应用,或者将原本运行已久、没有关联的几个应用融合为一个应用。微前端既可以将多个项目融合为一,又可以减少项目之间的耦合,提升项目扩展性,相比一整块的前端仓
一、jQuery简介1.1. JS库JavaScript 库封装了很多预定义的对象和实用函数。能帮助使用者建立有高难度交互客户端页面, 并且兼容各大浏览器。1.2. 当前流行的 JavaScript 库有:① jQuery ,最流行② EXT JS,2.0开始收费③ Prototype,对js扩展,框架开发。④ Dojo⑤ Bootstrap,来自 Twitter,是目前很
转载
2024-04-17 12:45:03
24阅读
随着移动互联网的发展和越来越多创业公司的加入,Web前端工程师的岗位空缺越来越大,薪资迅速上涨。Web前端工程师比以往更具有号召力。想要自学成为炙手可热的Web前端工程师?靠零碎化的短视频可不行,你需要更加对症下药的体系化好课程——WEB课程视频教程 ,为想要自学成才的Web前端新星们献上一套完整的自学课程,此次课程包含了10个阶段全套的在线课程,同时提供了视频和源代码的mian fei下载。从w
# 深入了解qiankun和jquery
## 什么是qiankun?
qiankun 是一个基于微前端架构的JavaScript库,它可以帮助开发者构建复杂的前端应用程序,将一个大型应用拆分成多个独立的子应用。每个子应用可以独立开发、部署和运行,同时可以动态地加载和卸载。qiankun 提供了一整套解决方案,包括路由、状态管理、样式隔离等功能,方便开发者在微前端架构下构建应用程序。
##
原创
2024-06-01 06:55:25
91阅读
作者: 纸上的彩虹技术栈简介微前端qiankundockergitlab-ci/cdnginx如果看完文章不是很理解,可以配合[视频解说查看本文] 视频地址:https://www.bilibili.com/video/BV1Qg411u7C9什么是微前端微前端是一种多个团队通过独立发布功能的方式来共同构建现代化 web 应用的技术手段及方法策略。微前端架构具备以下几个核心价值:技术栈无关 主框架
转载
2023-09-22 13:50:16
494阅读
webpack 5 模块联邦实现微前端疑难问题解决说明webpack 5 新增 Module Federation(模块联邦)功能,他可以帮助将多个独立的构建组成一个应用程序,不同的构建可以独立的开发与部署。借助模块联邦我们可以一定程度的实现微前端概念1. 什么是微前端?微前端将微服务理念扩展到前端开发,一般来讲一个微服务架构中会有多个后端团队开发不同的业务服务,而前端通常只有一个团队,集中维护一
typora-copy-images-to: images typora-root-url: imagesjQuery基本介绍什么是jQuery?jQuery是一个快速的、轻量的、功能丰富的js库。jQuery的官网 http://jquery.com/jQuery就是一个js库,使用jQuery的话,会比使用JavaScript更简单。js库:把一些常用到的方法写到一个单独的js文件,使用的时候
目录jQuery介绍jQuery的优势jQuery内容:jQuery版本jQuery对象jQuery基础语法查找标签基本选择器层级选择器:基本筛选器:属性选择器:表单筛选器:筛选器方法操作标签样式操作位置操作尺寸:文本操作属性操作文档处理事件常用事件事件绑定移除事件阻止后续事件执行阻止事件冒泡页面载入事件委托动画效果补充each.data()jQuery介绍jQuery是一个轻量级的、兼容多浏览器
转载
2023-09-08 21:22:09
93阅读
很多同学在项目中都喜欢将数据存储在HTMLElement属性上,如
<div data="some data">Test</div>
<script>
div.getAttribute('data'); // some data
</script>给页面中div添加了自定义属性“data”及值“some data”。后续JS代码中使用getAttr
一、使用的插件一个折叠的功能导航,由Akordeon插件实现。Nanoscroller插件与Tagit插件主要用于美化页面。这里只是测试,其实还可以综合使用其它的插件,例如将Akordeon插件换成菜单插件,而且也可以使用jquery ui,之所以没有使用jquery ui,是因为修改jquery ui 的style对我来说比较复杂,所以没用。还有用户添加分类信息时如果需要弹出一个层,可以使用Li
转载
2023-11-04 15:16:42
133阅读