VueRouter官网**https://router.vuejs.org/zh**安装**npminstallvue-router@4**代码**demo\src\router\index.js**`import{createRouter,createWebHashHistory,createWebHistory}from"vue-router"constroutes=[{path:

背景前段时间给基于vue3的H5项目做一些优化，该项目经常会有一些页面间的通信，譬如选择地址、乘机人等信息后回填到上一个页面。对于这种简单、频繁的通信，实在不想搞成重火力（eg:pinia）。最好让使用者用完即走，不用操心除业务逻辑之外的任何事情。路由控制页面通信既然是页面间的

背景项目中有一个系统使用的微前端，主站使用是vue2实现的，使用的是vue-router3.x。子应用有使用vue3实现的，使用的为vue-router4.x。该子应用中的页面A有通过操作按钮触发跳转到其他子应用页面B的需求，此时使用的是vue-router4.x的编程式导航API。当通过点击主站的Tab切换回B的时候

 懒加载写法{path:"/",name:"index",component:()=>import("../views/Home.vue"),}创建Loading组件并引入到顶层组件中使用store控制loading组件是否展示包装懒加载写法constlazyLoad=(componentPath)=>{//注意：componentPath不

最后是完整的vite.config.ts、main.ts配置1、先用vite创建一个项目npmcreatevite@latest2、安装elementplusyarnaddelement-plus@element-plus/icons-vuevite.config.ts配置组件按需导入，图标自动导入npminstall-Dunplugin-vue-componentsunplugin-auto-impor

因为2022年2月7日以后，vue-router的默认版本，为4版本，而且vue-router4,只能在vue3中，只有vue-router3中，能用在vue2中如果把vue-router4强制安装到vue2中，则会报上面的错误；解

使用vite4、vue3、vue-router4搭建动态路由的时候遇到的问题及解决方法解决！！我使用的是登录接口返回菜单，使用pinia存储菜单数据，使用pinia-plugin-persist加js-cookie进行

constroutes=[ { path:'', name:'home', component:()=>import(/*webpackChunkName:"home"*/'../pages/index'), children:[ { path:'',

1.vite+TS+Vue3npmcreateviteProjectname:...yourProjectNameSelectaframework:>>VueSelectavariant:>>Typescrit2.修改vite基本配置配置Vite{#configu

原因：内部判断，导致路由产生了死循环  错误代码：router.beforeEach((to,from,next)=>{if(store.getters.token){if(to.path==='/login'){