1-2、创建vue项目 接下来就是创建vue,这个命令之前装single-spa的时候就遇到过,让我升级vue3。 所以你在安装时如果提示你升级,就按照提示进行升级,不然会报错。 vue create base 由于忘记截图,这个是之前搭single-spa时的截图,一样的道理,只是文件夹名称和create名称不一样而已,可以理解大概意思 。 提示vue creat...
在Vue2项目中搭建微前端MicroApp可以通过以下步骤实现: 1. 创建Vue2项目 首先,你需要创建一个Vue2项目。如果你还没有安装Vue CLI,可以使用以下命令进行安装: bash npm install -g @vue/cli 然后,创建一个新的Vue2项目: bash vue create my-vue2-app 按照提示选择Vue 2作为项目的版本。 2. 安装MicroApp...
微前端 micro-app 搭建 官网:https://zeroing.jd.com/docs.html#/zh-cn/configure 环境: 主应用:vue2,名称:cde-railfore 子应用:vue3,名称:cde-standard,vite 搭建,参考:https://www.cnb
Micro App react16应用 react17应用 vue2应用 vue3应用 vite应用 angular11应用 多个应用 自带页面Serati Ma 发送数据 home page2 Vue@2.6.14 Welcome to Your Vue.js App {"from":"来自基座的初始化数据"}
2.子应用 //初始化一个vue应用 vue create child-vue 设置跨域支持(根目录新增vue.config.js) module.exports = { devServer: { port: 3000, headers: { "Access-Control-Allow-Origin":"*", }, }, }; 修改路由配置 //router.js import Vue from"vue"; ...
1. 第一步,创建2个vue3+vite项目 创建【main-vue3-app】主系统,以及【child-vue3-app】子系统。 然后就是安装 vue-router、sass依赖,里面代码敲敲敲,再把主、子系统跑起来。 ps: 主系统访问ip端口:http://127.0.0.1:1111/ 子系统访问ip端口:http://127.0.0.1:2222/child-vue3/ ...
(2)权限管理 (3)会话管理 (4)路由、菜单管理 (5)主题管理 (6)共享依赖 (7)多语言管理(最重要的一点) content里面可以任意放不同技术的子应用,只需要开发一个主应用(主应用也可以自由选择语言,目前支持react、vue、vite、angular、next.js、nuxt.js),将一些分散的应用接进来,主应用还可以通过控制权限,让不同...
# 全局安装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:
因为micro-app对主服务和子服务的技术栈没有任何要求,所以,我们新建三个项目,my-app(React)、my-app1(React)、my-app2(Vue)。 my-app是整体项目的主服务,也就是基座,my-app1和my-app2都是平级的子服务。 因为是写demo,所以React和Vue项目都基于其框架提供的脚手架create-react-app和vue-cli来构建,不基于...
默认启动react基座应用,如果想启动vue基座应用,可以运行yarn start:main-vue2 FAQ 问题汇总 micro-app的优势在哪里? 上手简单、侵入性低,只需改动少量的代码即可接入微前端,同时提供丰富的功能。 具体细节请参考文章:micro-app介绍 兼容性如何? micro-app依赖于CustomElements和Proxy两个较新的API。