创建vue.config.js 文件,设置 port : module.exports = { devServer: { port: 8090 } } 三、配置子应用 在主应用同一级目录下快速创建子应用,子应用无需安装 qiankun 配置子应用 main.js: import Vue from 'vue'; import VueRouter from 'vue-router'; import App
router for Vue.js 2 and qiankun(乾坤) 2. Latest version: 1.0.0, last published: a year ago. Start using qiankun-vue2-router in your project by running `npm i qiankun-vue2-router`. There are no other projects in the npm registry using qiankun-vue2-router.
import { createRouter, createWebHistory } from "vue-router"; const routes=[ { path:'/other-site', component: ()=> import('@/views/other-site.vue'), name:'other-site', }, ]; let router=createRouter({ history: createWebHistory(process.env.BASE_URL), routes, }); exportdefaultrouter...
import Vue from 'vue' import Router from 'vue-router' Vue.use(Router) const Index = resolve => require(['@/views/index'], resolve) const routes = [ { path: '/', name: '主页', component: Index } ] const router = new Router({ base: "/qiankun-main", //配合nginx生产发布https:...
import routers from"./router"; import { createWebHistory, createRouter } from"vue-router"; import"./publicPath.js"; let router=null; let instance=null; let mountNode=null;//渲染函数functionrender(props ={}) { const { container }=props; ...
主应用跳转子应用this.$router.push routes中配置对应子应用路由地址即可 代码语言:javascript 代码运行次数:0 运行 AI代码解释 constrouter=newVueRouter({mode:'history',routes:[{path:'/',name:'home',// component: () => import('./views/Home.vue')},{path:'/home',name:'home',component:()=>...
router, store, render: h => h(App) }).$mount('#app') 7、打开vue-qiankun-app1的 main.js import './public-path' import Vue from 'vue' import VueRouter from 'vue-router' import App from './App.vue' import routeList from './router' ...
vue create qiankun-main 1. 创建src/components/father.vue,内容如下: <template> 我是father </template> export default { name: "father" } 1. 2. 3. 4. 5. 6. 7. 8. src/router/index.js中添加路由信息,内容如下: import Router from 'vue-router'...
:VueRouter;// `mounted` 是 Vue 的生命周期钩子函数,在组件挂载时执行mounted(){// 注册一个观察者函数actions.onGlobalStateChange((state,prevState)=>{// state: 变更后的状态; prevState: 变更前的状态console.log("主应用观察者:token 改变前的值为 ",prevState.token);console.log("主应用观察者:登录...
看了下,VueRouter4的问题,主应用跳转路由时,触发了一个错误的路由,single-spa 监听到了就卸载了子应用。 从/vue3跳转到/vue3/list时,中间会跳转到/list(这一步会触发卸载),然后才跳转到/vue3/list。主应用的路由钩子没有监听到这个路由跳转,但是 single-spa 能监听到 ...