xmf df2af8dbbb feat(cip-subapp-container/micro-app): 支持增则类型的路由 | 2 سال پیش | |
---|---|---|
.. | ||
README.md | 2 سال پیش | |
index.vue | 2 سال پیش | |
public-path.js | 2 سال پیش | |
set-custom-element.js | 2 سال پیش | |
util.js | 2 سال پیش |
# 安装依赖
npm i -S @micro-zoe/micro-app
yarn add @micro-zoe/micro-app
pnpm i -S @micro-zoe/micro-app
// vue.config.js
const setCustomElement = require('@cip/components/cip-subapp-container/micro-app/set-custom-element')
chainWebpack: config=> {
setCustomElement(config)
}
// main.js
import microApp from '@micro-zoe/micro-app'
microApp.start()
// routes.js
import { generateSubRoutes } from '@cip/components/cip-subapp-container/micro-app/util'
const subAppRoutes = generateSubRoutes([
{name: 'meta', url: '/meta', baseRoute: '/meta'}, // 相对路径
{name: 'aim', uri: 'http://127.0.0.1', baseRoute: '/aim'} // 绝对路径
])
sub_modules/components 切换位v4.x-beta 以上
// main.js
import '@cip/components/cip-subapp-container/micro-app/public-path'
import { microAppRender } from '@cip/components/cip-subapp-container/micro-app/util'
if (window.__MICRO_APP_ENVIRONMENT__) {
microAppRender(render)
} else {
// 独立时的渲染方式
console.time('render')
render().then((res) => {
console.timeEnd('render')
})
}
// /render/index.js
// 关键代码
const router = createRouter({
// 子应用时采用内存方式记录路由
history: routerBase
? createMemoryHistory(routerBase)
: createWebHistory(process.env.BASE_URL),
routes: routes
})
return { instance, router }
// judge-framework.js
if (window.__MICRO_APP_BASE_ROUTE__) return false