需求原因:原本的项目都是hash模式的,但是后续有些页面需要给到微信那边,微信那边不能带有#,而之前的hash模式的部分链接固定在了Flutter的webview中,所以需要两者模式共存,既不影响之前的调用也能提供给微信那边调用
- 要调整的项目主要技术栈是:vue2.6.12 + webpack5.11.0
- 修改之前访问check页面的链接为:http://localhost:3000/#/index 如下图:
步骤一:再次新增一个routerHis.js把router的mode改成history
import Vue from 'vue';
import Router from 'vue-router';
Vue.use(Router);
const routerHis = new Router({
mode: 'history', // 指定为history模式
routes: [
// 定义路由
]
});
export default routerHis;
在main.js
上的router设置
import Vue from 'vue'
import router from './router/index'
import router1 from './router/index1'
let vue = new Vue({
...
// router,
router: router1 && router,
...
})
window.vue = vue
可是在这里末尾还是会自动加上# :http://localhost:3000/index#/ ,如下图
history末尾还是自动补上#问题?【后续解决补充】