diff --git a/.env.development b/.env.development index 23c4c72fa..51fce4dd0 100644 --- a/.env.development +++ b/.env.development @@ -7,6 +7,11 @@ VITE_PUBLIC_PATH = / # 开发环境代理 VITE_PROXY_DOMAIN = /api +# 开发环境路由历史模式 +VITE_ROUTER_HISTORY = "hash" + # 开发环境后端地址 VITE_PROXY_DOMAIN_REAL = "http://127.0.0.1:3000" + + diff --git a/.env.production b/.env.production index eace0a9ae..5537b0c92 100644 --- a/.env.production +++ b/.env.production @@ -1,5 +1,8 @@ # 线上环境项目打包路径 VITE_PUBLIC_PATH = / +# 线上环境路由历史模式 +VITE_ROUTER_HISTORY = "hash" + # 线上环境后端地址 VITE_PROXY_DOMAIN_REAL = "" diff --git a/src/router/index.ts b/src/router/index.ts index e560c6f6c..fa7b6452c 100644 --- a/src/router/index.ts +++ b/src/router/index.ts @@ -1,10 +1,4 @@ -import { - Router, - RouteMeta, - createRouter, - RouteRecordName, - createWebHashHistory -} from "vue-router"; +import { Router, RouteMeta, createRouter, RouteRecordName } from "vue-router"; import { toRouteType } from "./types"; import { openLink } from "/@/utils/link"; import NProgress from "/@/utils/progress"; @@ -17,6 +11,7 @@ import { useMultiTagsStoreHook } from "/@/store/modules/multiTags"; import { usePermissionStoreHook } from "/@/store/modules/permission"; import { initRouter, + getHistoryMode, getParentPaths, findRouteByPath, handleAliveRoute @@ -24,8 +19,9 @@ import { // 创建路由实例 export const router: Router = createRouter({ - history: createWebHashHistory(), + history: getHistoryMode(), routes: constantRoutes.concat(...remainingRouter), + strict: true, scrollBehavior(to, from, savedPosition) { return new Promise(resolve => { if (savedPosition) { diff --git a/src/router/utils.ts b/src/router/utils.ts index cb0a87b99..5ce31159a 100644 --- a/src/router/utils.ts +++ b/src/router/utils.ts @@ -1,9 +1,13 @@ import { + RouterHistory, RouteRecordRaw, RouteComponent, + createWebHistory, + createWebHashHistory, RouteRecordNormalized } from "vue-router"; import { router } from "./index"; +import { loadEnv } from "../../build"; import Layout from "/@/layout/index.vue"; import { useTimeoutFn } from "@vueuse/core"; import { RouteConfigs } from "/@/layout/types"; @@ -221,11 +225,36 @@ const addAsyncRoutes = (arrRoutes: Array) => { return arrRoutes; }; +// 获取路由历史模式 https://next.router.vuejs.org/zh/guide/essentials/history-mode.html +const getHistoryMode = (): RouterHistory => { + const routerHistory = loadEnv().VITE_ROUTER_HISTORY; + // len为1 代表只有历史模式 为2 代表历史模式中存在参数base https://next.router.vuejs.org/zh/api/#%E5%8F%82%E6%95%B0-1 + const historyMode = routerHistory.split(","); + const leftMode = historyMode[0]; + const rightMode = historyMode[1]; + // no param + if (historyMode.length === 1) { + if (leftMode === "hash") { + return createWebHashHistory(""); + } else if (leftMode === "h5") { + return createWebHistory(""); + } + } //has param + else if (historyMode.length === 2) { + if (leftMode === "hash") { + return createWebHashHistory(rightMode); + } else if (leftMode === "h5") { + return createWebHistory(rightMode); + } + } +}; + export { ascending, filterTree, initRouter, resetRouter, + getHistoryMode, addAsyncRoutes, delAliveRoutes, getParentPaths, diff --git a/types/global.d.ts b/types/global.d.ts index dd6efe920..3676a685b 100644 --- a/types/global.d.ts +++ b/types/global.d.ts @@ -68,6 +68,7 @@ declare global { VITE_PUBLIC_PATH: string; VITE_PROXY_DOMAIN: string; VITE_PROXY_DOMAIN_REAL: string; + VITE_ROUTER_HISTORY: string; } declare interface ServerConfigs {