微前端qiankun嵌入vue项目后iconfont显示方块

最新推荐文章于 2024-05-17 14:32:46 发布
最新推荐文章于 2024-05-17 14:32:46 发布
阅读量346 收藏
点赞数
文章标签： vue.js 前端 javascript
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/weixin_42681555/article/details/134268370
版权

个人项目地址： SubTopH前端开发个人站

（自己开发的前端功能和UI组件，一些有趣的小功能，感兴趣的伙伴可以访问，欢迎提出更好的想法，私信沟通，网站属于静态页面）

SubTopH前端开发个人站icon-default.png?t=N7T8https://subtop.gitee.io/subtoph.github.io/#/home

以上 👆 是个人前端项目，欢迎提出您的建议😊

以下是正文内容...............

 解决方法：修改iconfont.css文件的woff2的url将，修改未base64

base64代码生成获取

在阿里图库的 点击生成代码 

打开代码链接地址 复制替换项目中的iconfont.css

次顶级
关注
  • 0
    点赞
  • 踩
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
内涵 qianku 前端微服务项目 以及vue 和react子项目 源码
09-08
内涵 qianku 前端微服务项目 以及vue 和react子项目 源码 本人学习记录 代码注释详细 需要的小伙伴可以欢迎下载
qiankun微前端在vue项目中的应用
05-11
qiankun微前端在vue项目中的应用
微前端完整vue实例-乾坤【qiankun】
01-16
功能说明： 1.此实例包含有一个`qiankun-main`主应用和`qiankun-vue-child`子应用。【可以包含若干个子应用，这里只建立一个vue子应用进行演示】 2.主应用跨域访问子应用系统。 3.无node_modules，执行npm install即可。 更新时间：2021-03-26
本项目采用vue+qiankun实践微前端落地.zip
01-20
vue项目实战:本项目采用vue+qiankun实践微前端落地.zip
基于vue+qiankun微前端项目实战vue项目（新手学习）.zip
03-03
基于vue+qiankun微前端项目实战vue项目.zip 本项目采用 vue + qiankun 实践微前端落地。 同时 qiankun 是一个开放式微前端架构，支持当前三大前端框架甚至 jq 等其他项目无缝接入。 此项目为了尽可能的简单易上手，以及方便文章讲解，大部分逻辑都在主应用和子应用的 main.js 来回施展， 实际项目应用可不要如此粗暴，要有优雅的架构设计。
vue引入阿里巴巴图标库并引用（引入图标显示为方框解决方法）
m0_71751187的博客
10-25 393
iconfont必须加上 下面为对应图标。这里在app.vue中引用。
微前端qiankun接入Vue和React项目
Hhjian524的博客
10-26 1638
微前端qiankun使用
vue微前端qiankun框架学习到项目实战
qq_42696432的博客
09-22 3092
技术无关，独立开发，独立部署，增量升级，独立运行，微前端的核心目标是将巨石应用拆解成若干可以自治的松耦合微应用。
微前端（qiankun）vue2、vue3微应用嵌入
天高任鸟飞
02-18 1440
微前端是一种多个团队通过独立发布功能的方式来共同构建现代化 web 应用的技术手段及方法策略。
微前端qiankun架构 (基于vue2实现)使用教程
站在巨人的肩膀上前行
02-11 3723
在 utils 内创建 微应用文件夹 microApp,同时在该文件夹内创建微应用出口文件 index.js,路由文件 microAppRouter,配置函数文件 microAppSetting。在main.js文件内引入微应用出口文件 index.js。使用vue脚手架创建主应用main和子应用dev。在App.vue内配置微应用容器及跳转菜单。创建文件夹qiankun-test。微应用出口文件 index.js。配置Webpack、跨域与端口号。路由文件router.js。路由文件router.js。
iconfont阿里图标库使用；iconfont显示为方框；iconfont阿里图标库，依赖文件只有.woff2没有.woff和.ttf文件；
killerdoubie的博客
02-24 727
iconfont阿里图标库使用；iconfont显示为方框；iconfont阿里图标库，依赖文件只有.woff2没有.woff和.ttf文件；
【已解决】react 简书项目，全局引用后iconfont图标变成方块问题
超逸の学习技术博客
10-13 1621
背景 最近，在做 react 简书项目时候，使用 iconfont 时，出现图标变成方块问题，想了想，应该没有什么问题啊，后面发现 styled-components 中创建全局样式替换成了 createGlobalStyle。 解决 createGlobalStyle 时，需要导出当前全局样例，例如我的 iconfont.js 文件代码如下： import { createGlobalStyle } from 'styled-components'; /* 使用 reset.css 设置默认样式*/ ex
iconfont字体图标引用出现框框问题解决办法
qq1722377628的博客
11-18 7128
问题描述： 编译完全没问题，控制台也出现了使用的iconfont类及unicode编码（这里我使用的是unicode编码，使用iconclose类也是同样的结果） 解决思路： 由于在看视频做这个项目时使用的是stylus语法，我怀疑是把下载下来的css样式改为stylus导致出现这个bug，所以我一狠心，改回了css语法，问题解决！ PS： 另外我在网上查询这个问题时，发现出现这种问题的原因是多种...
layui图标出现方框问题解决
追寻上飞的博客
05-17 5400
layui解决图标出现方框问题一、软件版本二、问题描述三、解决思路1. 上开发者工具2. 定位错误位置3. 修改图标加载的相对文件路径四、结果 一、软件版本 OS: Win10 layui: 2.6.5 浏览器：Chrome 90.0.4430.212（正式版本） （64 位） 二、问题描述 当在本地开发网页时，引用layui框架样式表和js，目录结构如下图所示。 加载layui的日期控件时，出现如下图所示的界面。日期前进和后退的按钮变成了方框。 三、解决思路 1. 上开发者工具 F12打开谷歌浏览
WEB转Flutter基础学习笔记（内含vue和flutter对比）
最新发布
小易不止于搬砖的博客
05-17 671
笔者是一名web前端，记录在转栈flutter时的学习笔记，内涵和vue的对比，能够辅助前端同学更容易理解flutter
vue3.0+antdv的admin管理系统vue-admin-beautiful推荐
独行猫a 的沉淀、积累、总结。天天学习，好好向上...c/c++,嵌入式 linux,Android,HarmonyOS)
05-15 1110
几年前，笔者自学了vue这一优秀的前端框架，但苦于没项目练手，无意间发现了这一优秀的前端集成框架。当时就使用它做了一很有意思的小项目---终端监控云平台，实现了前端和后台的整体功能。整体方案介绍参见博文《》，前端使用vue-admin-beautiful框架，后端使用go-zero微服务框架，几天内就搞出来了一个包含前端和后台的小项目。我的monitor-ui前端运行界面：后续有机会介绍下我这个终端监控云平台小项目的具体实现，挺有意思的。几年前还用到过几个地方的公交客户现场，客户挺喜欢这个功能的。
vue中的事件
weixin_43390711的博客
05-16 162
需要使用emit方法，emit(‘事件名’,参数)自定义事件名的规范（script中用小驼峰，模板中用短横线）1、组合api中2、setup语法糖中(非TS)3、setup语法糖中（使用TS）}>()
Vue.js的发展史（一）
2301_79683791的博客
05-15 755
Vue (发音为 /vjuː/，类似view) 是一款用于构建用户界面的 JavaScript 框架。它基于标准 HTML、CSS 和 JavaScript 构建，并提供了一套声明式的、组件化的编程模型，帮助你高效地开发用户界面。无论是简单还是复杂的界面，Vue 都可以胜任。来源官方解释-----简介 | Vue.js (vuejs.org)简单来说：Vue是一个属于JS的库，可直接引入一个JS文件就可以使用，与传统JS和JQuery框架不同，Vue的渐进式框架。
微前端qiankun vue
09-01
微前端是一种架构模式，它的目标是将大型的前端应用拆分为多个子应用，每个子应用可以独立开发、部署和运行。qiankun是一个基于single-spa的微前端解决方案，它提供了一套完整的微前端架构方案。 在使用qiankun时，你可以将你的Vue应用拆分为多个子应用，每个子应用可以是一个独立的Vue项目。这些子应用可以独立开发和部署，同时可以通过qiankun进行协同工作。qiankun提供了一套API和生命周期钩子，可以帮助你在父应用和子应用之间进行通信和交互。 在使用qiankun时，你需要在父应用中注册子应用，并配置子应用的入口文件、路由等信息。然后在父应用中使用qiankun提供的组件来渲染子应用。当父应用加载时，qiankun会自动加载并初始化子应用，并将子应用嵌入到父应用中。父应用和子应用之间可以通过事件、props等方式进行通信和交互。 总结来说，qiankun是一个基于single-spa的微前端解决方案，可以帮助你将Vue应用拆分为多个子应用，并协同工作。通过使用qiankun，你可以实现前端应用的模块化和解耦，提高开发效率和可维护性。

“相关推荐”对你有帮助么？

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明：

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

余额充值