From b476e1c84c52dab7030fd19b34ecd33e65fadcb2 Mon Sep 17 00:00:00 2001
From: Vben <anncwb@126.com>
Date: Mon, 1 Mar 2021 23:01:37 +0800
Subject: [PATCH] fix: ensure that the correct components are dynamically
 imported

---
 .env                             |  3 +++
 build/utils.ts                   |  1 +
 src/router/helper/routeHelper.ts | 20 +++++++++++++++++---
 src/settings/projectSetting.ts   |  2 +-
 types/window.d.ts                |  1 +
 vite.config.ts                   | 10 +++++++++-
 6 files changed, 32 insertions(+), 5 deletions(-)

diff --git a/.env b/.env
index b1a9ec8b4bc..375b9444ff8 100644
--- a/.env
+++ b/.env
@@ -6,3 +6,6 @@ VITE_GLOB_APP_TITLE = Vben Admin
 
 # spa shortname
 VITE_GLOB_APP_SHORT_NAME = vue_vben_admin
+
+
+VITE_DYNAMIC_IMPORT = false
diff --git a/build/utils.ts b/build/utils.ts
index d5e95e3c166..62803a35be7 100644
--- a/build/utils.ts
+++ b/build/utils.ts
@@ -30,6 +30,7 @@ export interface ViteEnv {
   VITE_BUILD_COMPRESS: 'gzip' | 'brotli' | 'none';
   VITE_LEGACY: boolean;
   VITE_USE_IMAGEMIN: boolean;
+  VITE_DYNAMIC_IMPORT: boolean;
 }
 
 // Read all environment variable configuration files to process.env
diff --git a/src/router/helper/routeHelper.ts b/src/router/helper/routeHelper.ts
index 9ce99bc5636..0b2fdc36fd0 100644
--- a/src/router/helper/routeHelper.ts
+++ b/src/router/helper/routeHelper.ts
@@ -9,10 +9,22 @@ export type LayoutMapKey = 'LAYOUT';
 
 const LayoutMap = new Map<LayoutMapKey, () => Promise<typeof import('*.vue')>>();
 
-const dynamicViewsModules = import.meta.glob('../../views/**/*.{vue,tsx}');
+let dynamicViewsModules: Record<
+  string,
+  () => Promise<{
+    [key: string]: any;
+  }>
+>;
 
 // 动态引入
 function asyncImportRoute(routes: AppRouteRecordRaw[] | undefined) {
+  // TODO It may be a bug in Vite. When the conditions are not established, the dynamically imported files will still be packaged in.
+  if (!__DYNAMIC_IMPORT__) {
+    dynamicViewsModules = {};
+  } else {
+    dynamicViewsModules = dynamicViewsModules || import.meta.glob('../../views/**/*.{vue,tsx}');
+  }
+
   if (!routes) return;
   routes.forEach((item) => {
     const { component, name } = item;
@@ -37,8 +49,10 @@ function dynamicImport(
 ) {
   const keys = Object.keys(dynamicViewsModules);
   const matchKeys = keys.filter((key) => {
-    const k = key.replace('../../views', '');
-    return k.startsWith(`${component}`) || k.startsWith(`/${component}`);
+    let k = key.replace('../../views', '');
+    const lastIndex = k.lastIndexOf('.');
+    k = k.substring(0, lastIndex);
+    return k === component;
   });
   if (matchKeys?.length === 1) {
     const matchKey = matchKeys[0];
diff --git a/src/settings/projectSetting.ts b/src/settings/projectSetting.ts
index db87780010c..49a5429db2b 100644
--- a/src/settings/projectSetting.ts
+++ b/src/settings/projectSetting.ts
@@ -19,7 +19,7 @@ const setting: ProjectConfig = {
   settingButtonPosition: SettingButtonPositionEnum.AUTO,
 
   // Permission mode
-  permissionMode: PermissionModeEnum.ROLE,
+  permissionMode: PermissionModeEnum.BACK,
 
   // Permission-related cache is stored in sessionStorage or localStorage
   permissionCacheType: CacheTypeEnum.SESSION,
diff --git a/types/window.d.ts b/types/window.d.ts
index 15d69744a2a..01c5d4245d2 100644
--- a/types/window.d.ts
+++ b/types/window.d.ts
@@ -1,6 +1,7 @@
 import type { App } from 'vue';
 
 declare global {
+  declare const __DYNAMIC_IMPORT__: boolean;
   declare interface Window {
     // Global vue app instance
     __APP__: App<Element>;
diff --git a/vite.config.ts b/vite.config.ts
index 927c1ea559b..4a73538ebe3 100644
--- a/vite.config.ts
+++ b/vite.config.ts
@@ -21,7 +21,14 @@ export default ({ command, mode }: ConfigEnv): UserConfig => {
   // The boolean type read by loadEnv is a string. This function can be converted to boolean type
   const viteEnv = wrapperEnv(env);
 
-  const { VITE_PORT, VITE_PUBLIC_PATH, VITE_PROXY, VITE_DROP_CONSOLE, VITE_LEGACY } = viteEnv;
+  const {
+    VITE_PORT,
+    VITE_PUBLIC_PATH,
+    VITE_PROXY,
+    VITE_DROP_CONSOLE,
+    VITE_LEGACY,
+    VITE_DYNAMIC_IMPORT,
+  } = viteEnv;
 
   const isBuild = command === 'build';
 
@@ -68,6 +75,7 @@ export default ({ command, mode }: ConfigEnv): UserConfig => {
     define: {
       // setting vue-i18-next
       // Suppress warning
+      __DYNAMIC_IMPORT__: VITE_DYNAMIC_IMPORT,
       __VUE_I18N_LEGACY_API__: false,
       __VUE_I18N_FULL_INSTALL__: false,
       __INTLIFY_PROD_DEVTOOLS__: false,