在Vue3项目中使用micro-app进行微前端开发,可以遵循以下步骤: 1. 安装micro-app 首先,你需要在主应用(基座应用)中安装micro-app。你可以使用npm、yarn或pnpm进行安装: bash npm install @micro-zoe/micro-app --save # 或者 yarn add @micro-zoe/micro-app # 或者 pnpm add @micro-zoe/micro-app 2. 在...
* 当前vue-router版本:4.0.12*/functionfixBugForVueRouter4(router: Router) {//判断主应用是main-vue3或main-vite,因为这这两个主应用是 vue-router4if(window.__MICRO_APP_ENVIRONMENT__) {//if (window.location.href.includes('/main-vue3') || window.location.href.includes('/main-vite')) {/...
* 当前vue-router版本:4.0.12*/functionfixBugForVueRouter4(router: Router) {//判断主应用是main-vue3或main-vite,因为这这两个主应用是 vue-router4if(window.__MICRO_APP_ENVIRONMENT__) {//if (window.location.href.includes('/main-vue3') || window.location.href.includes('/main-vite')) {/...
npm i @micro-zoe/micro-app --save 1. 2. 导入并启用微前端框架 microApp src/main.ts AI检测代码解析 import microApp from '@micro-zoe/micro-app' microApp.start() 1. 2. 3. 3. 添加配置 vite.config.ts 的 vue 中添加配置 AI检测代码解析 vue({ template: { compilerOptions: { isCustomEle...
wujie微应用的子应用(vite+vue3)动态图片特定不显示? 1.2k 阅读 使用qiankun主应用,想把vue3+vite 项目做成子应用,有一些问题? 1 回答1.6k 阅读✓ 已解决 vue3+vite为基座,vue2为子应用,使用的是qiankun,为什么加载子应用的时候会出现跨域的错误? 1 回答2.9k 阅读 Vite+vue3+Router4 在事件中添加子路由...
vite+vue+micro-app 配置分为两部分,主应用也就是基座应用,子应用部分:基座应用:入口文件main.js,映入微前端引擎micro-app启动微前端。此处的loader的作用是因为vite开发模式下引入的资源是相对路径,但是子应用也是vite的情况下,主应用加载资源的时候就会以主应用为域名去加载,加载不到子应用的资源,所以无法...
1、依然使用推荐框架 vite + vue3 等基础框架做试用 2、下载依赖 AI检测代码解析 yarnadd@micro-zoe/micro-app--save 1. 当时笔者使用的版本是:@micro-zoe/micro-app@1.0.0-rc.4,后面为了解决一些问题(后述博客会有提及),增加了版本到@micro-zoe/micro-app@1.0.0-rc.5,各位小伙伴若基于本博客使用,注意...
import { useRouter } from "vue-router";export default { setup() { const state = reactive({ microApp_ifs: null, microApp_pis: null, microApp_tms: null, data: [], ifs: 0, pis: 0 }); const route = useRouter(); watch(() => route.currentRoute.value.path, (count, prevCount) ...
PC统一使用react,但是有一些老的项目是vue的,本次新页面较多,老页面的改动较少,除此之外老项目想换菜单,因此想借助本次机会用react开发,经过了几番思考,发现本次很适合用微前端来完成本次需求,最终决定用react搭建一个基座(主应用),将原来的vue项目接入到基座,这样不仅实现了新页面react开发,而且老项目也能和新...
# 全局安装vue-cli npm install -g vue-cli # 使用vue2-cli创建vue2+element子应用 vue create my-subapp 注意:子应用中应使用vue2来开发,因为vue2和vue3不兼容。 二、配置主应用 1. 安装micro-app: yarn add micro-app 2. 修改App.vue: