web打包问题

2026-01-07 15:30:29 +08:00
parent ec61f134a8
commit 72cea2935d
22 changed files with 762 additions and 335 deletions
--- a/urbanLifelineWeb/packages/workcase/.mftemp/workcase/localSharedImportMap.js
+++ b/urbanLifelineWeb/packages/workcase/.mftemp/workcase/localSharedImportMap.js
@@ -1,130 +0,0 @@
-
-// Windows temporarily needs this file, https://github.com/module-federation/vite/issues/68
-
-    import {loadShare} from "@module-federation/runtime";
-    const importMap = {
-      
-        "element-plus": async () => {
-          let pkg = await import("__mf__virtual/workcase__prebuild__element_mf_2_plus__prebuild__.js");
-            return pkg;
-        }
-      ,
-        "vue": async () => {
-          let pkg = await import("__mf__virtual/workcase__prebuild__vue__prebuild__.js");
-            return pkg;
-        }
-      ,
-        "vue-router": async () => {
-          let pkg = await import("__mf__virtual/workcase__prebuild__vue_mf_2_router__prebuild__.js");
-            return pkg;
-        }
-      
-    }
-      const usedShared = {
-      
-          "element-plus": {
-            name: "element-plus",
-            version: "2.12.0",
-            scope: ["default"],
-            loaded: false,
-            from: "workcase",
-            async get () {
-              if (false) {
-                throw new Error(`Shared module '${"element-plus"}' must be provided by host`);
-              }
-              usedShared["element-plus"].loaded = true
-              const {"element-plus": pkgDynamicImport} = importMap
-              const res = await pkgDynamicImport()
-              const exportModule = {...res}
-              // All npm packages pre-built by vite will be converted to esm
-              Object.defineProperty(exportModule, "__esModule", {
-                value: true,
-                enumerable: false
-              })
-              return function () {
-                return exportModule
-              }
-            },
-            shareConfig: {
-              singleton: false,
-              requiredVersion: "^2.12.0",
-              
-            }
-          }
-        ,
-          "vue": {
-            name: "vue",
-            version: "3.5.25",
-            scope: ["default"],
-            loaded: false,
-            from: "workcase",
-            async get () {
-              if (false) {
-                throw new Error(`Shared module '${"vue"}' must be provided by host`);
-              }
-              usedShared["vue"].loaded = true
-              const {"vue": pkgDynamicImport} = importMap
-              const res = await pkgDynamicImport()
-              const exportModule = {...res}
-              // All npm packages pre-built by vite will be converted to esm
-              Object.defineProperty(exportModule, "__esModule", {
-                value: true,
-                enumerable: false
-              })
-              return function () {
-                return exportModule
-              }
-            },
-            shareConfig: {
-              singleton: false,
-              requiredVersion: "^3.5.25",
-              
-            }
-          }
-        ,
-          "vue-router": {
-            name: "vue-router",
-            version: "4.6.3",
-            scope: ["default"],
-            loaded: false,
-            from: "workcase",
-            async get () {
-              if (false) {
-                throw new Error(`Shared module '${"vue-router"}' must be provided by host`);
-              }
-              usedShared["vue-router"].loaded = true
-              const {"vue-router": pkgDynamicImport} = importMap
-              const res = await pkgDynamicImport()
-              const exportModule = {...res}
-              // All npm packages pre-built by vite will be converted to esm
-              Object.defineProperty(exportModule, "__esModule", {
-                value: true,
-                enumerable: false
-              })
-              return function () {
-                return exportModule
-              }
-            },
-            shareConfig: {
-              singleton: false,
-              requiredVersion: "^4.6.3",
-              
-            }
-          }
-        
-    }
-      const usedRemotes = [
-                {
-                  entryGlobalName: "shared",
-                  name: "shared",
-                  type: "module",
-                  entry: "/shared/mf-manifest.json",
-                  shareScope: "default",
-                }
-          
-      ]
-      export {
-        usedShared,
-        usedRemotes
-      }
-      
--- a/urbanLifelineWeb/packages/workcase/index.html
+++ b/urbanLifelineWeb/packages/workcase/index.html
@@ -7,7 +7,7 @@
  <title>案例管理系统</title>
  
  <!-- 加载运行时配置（必须在其他脚本之前加载） -->
-  <script src="/app-config.js"></script>
+  <script src="/app-config.local.js"></script>
 </head>
 <body>
  <div id="app"></div>
--- a/urbanLifelineWeb/packages/workcase/public/app-config.local.js
+++ b/urbanLifelineWeb/packages/workcase/public/app-config.local.js
@@ -0,0 +1,65 @@
+/**
+ * @description 本地开发环境配置文件
+ * 用于 dev 和 preview 模式
+ */
+
+window.APP_RUNTIME_CONFIG = {
+  // 环境标识
+  env: 'production',
+
+  // API 配置
+  api: {
+    baseUrl: 'https://org.xyzh.yslg/api',
+    timeout: 30000
+  },
+
+  // 应用基础路径
+  baseUrl: '/workcase/',
+
+  // 文件配置
+  file: {
+    downloadUrl: 'https://org.xyzh.yslg/api/urban-lifeline/file/download/',
+    uploadUrl: 'https://org.xyzh.yslg/api/urban-lifeline/file/upload',
+    maxSize: {
+      image: 5,
+      video: 100,
+      document: 10
+    },
+    acceptTypes: {
+      image: 'image/*',
+      video: 'video/*',
+      document: '.pdf,.doc,.docx,.xls,.xlsx,.ppt,.pptx'
+    }
+  },
+
+  // Token 配置
+  token: {
+    key: 'token',
+    refreshThreshold: 300000
+  },
+
+  // 公共资源路径
+  publicImgPath: '/workcase/img',
+  publicWebPath: '/workcase',
+
+  // 单点登录配置
+  sso: {
+    platformUrl: 'https://org.xyzh.yslg/platform/',
+    workcaseUrl: 'https://org.xyzh.yslg/workcase/',
+    biddingUrl: 'https://org.xyzh.yslg/bidding/'
+  },
+
+  // AES 加密密钥（本地开发用，生产环境需要替换）
+  aesSecretKey: 'MTIzNDU2Nzg5MDEyMzQ1Njc4OTAxMjM0NTY3ODkwMTI=',
+
+  // Jitsi 视频会议配置
+  jitsi: {
+    serverUrl: 'https://meet.jit.si'
+  },
+
+  // 功能开关
+  features: {
+    enableDebug: true,
+    enableMockData: false
+  }
+};
--- a/urbanLifelineWeb/packages/workcase/src/main.ts
+++ b/urbanLifelineWeb/packages/workcase/src/main.ts
@@ -8,8 +8,6 @@ import './assets/css/common.scss'
 import App from './App.vue'
 import router from './router/'
 import { AES_SECRET_KEY } from './config/index'
-// @ts-ignore
-import { initAesEncrypt } from 'shared/utils'

 // 导入需要的 Lucide 图标（用于动态组件）
 import {
@@ -89,37 +87,41 @@ const lucideIcons = {

 // 异步初始化应用
 async function initApp() {
-    // 1. 初始化 AES 加密工具
+    // 1. 创建 Vue 应用
+    const app = createApp(App)
+
+    // 2. 注册 Pinia
+    const pinia = createPinia()
+    app.use(pinia)
+
+    // 3. 注册 Element Plus
+    app.use(ElementPlus)
+
+    // 4. 注册 Lucide 图标（用于动态组件）
+    for (const [name, component] of Object.entries(lucideIcons)) {
+        app.component(name, component)
+    }
+
+    // 5. 注册路由
+    app.use(router)
+
+    // 6. 立即挂载应用（不等待 AES 初始化）
+    app.mount('#app')
+    
+    console.log('✅ Workcase 应用启动成功')
+
+    // 7. 后台初始化 AES 加密工具（不阻塞渲染）
    try {
+        const { initAesEncrypt } = await import('shared/utils')
        await initAesEncrypt(AES_SECRET_KEY)
        console.log('✅ AES 加密工具初始化成功')
    } catch (error) {
        console.error('❌ AES 加密工具初始化失败:', error)
    }
-
-    // 2. 创建 Vue 应用
-    const app = createApp(App)
-
-    // 3. 注册 Pinia
-    const pinia = createPinia()
-    app.use(pinia)
-
-    // 4. 注册 Element Plus
-    app.use(ElementPlus)
-
-    // 5. 注册 Lucide 图标（用于动态组件）
-    for (const [name, component] of Object.entries(lucideIcons)) {
-        app.component(name, component)
-    }
-
-    // 6. 注册路由
-    app.use(router)
-
-    // 7. 挂载应用
-    app.mount('#app')
-    
-    console.log('✅ Workcase 应用启动成功')
 }

 // 启动应用
-initApp()
+console.log('🚀 开始初始化 Workcase 应用...')
+initApp().catch(error => {
+    console.error('❌ 应用初始化失败:', error)
+})
--- a/urbanLifelineWeb/packages/workcase/src/router/dynamicRoute.ts
+++ b/urbanLifelineWeb/packages/workcase/src/router/dynamicRoute.ts
@@ -9,17 +9,19 @@

 /// <reference types="vite/client" />

-import { 
-    generateSimpleRoutes, 
-    loadViewsFromStorage,
-    type RouteGeneratorConfig,
-    type GenerateSimpleRoutesOptions
-} from 'shared/utils/route'
-import type { TbSysViewDTO } from 'shared/types'
 import type { RouteRecordRaw } from 'vue-router'
 import router from './index'
 import { SidebarLayout, BlankLayout, SubSidebarLayout } from '@/layouts'

+// 动态导入 shared 模块（避免顶层 import 阻塞）
+async function loadSharedModules() {
+    const [routeUtils, types] = await Promise.all([
+        import('shared/utils/route'),
+        import('shared/types')
+    ])
+    return { routeUtils, types }
+}
+
 // Workcase 布局组件映射
 const workcaseLayoutMap: Record<string, () => Promise<any>> = {
    'SidebarLayout': () => Promise.resolve({ default: SidebarLayout }),
@@ -67,7 +69,7 @@ function viewLoader(componentPath: string): (() => Promise<any>) | null {
 }

 // Workcase 路由生成器配置
-const routeConfig: RouteGeneratorConfig = {
+const routeConfig: any = {
    layoutMap: workcaseLayoutMap,
    viewLoader,
    notFoundComponent: () => Promise.resolve({
@@ -78,7 +80,7 @@ const routeConfig: RouteGeneratorConfig = {
 }

 // Workcase 路由生成选项
-const routeOptions: GenerateSimpleRoutesOptions = {
+const routeOptions: any = {
    asRootChildren: false,  // 直接作为根级路由，不是某个布局的子路由
    iframePlaceholder: () => import('shared/components').then(m => ({ default: m.IframeView })),
    verbose: true  // 启用详细日志
@@ -88,17 +90,19 @@ const routeOptions: GenerateSimpleRoutesOptions = {
 * 添加动态路由（Workcase 特定）
 * @param views 视图列表（用作菜单）
 */
-export function addDynamicRoutes(views: TbSysViewDTO[]) {
+export async function addDynamicRoutes(views: any[]) {
    if (!views || views.length === 0) {
        console.warn('[Workcase] addDynamicRoutes: 视图列表为空')
        return
    }
    
    console.log('[Workcase] addDynamicRoutes: 开始添加动态路由，视图数量:', views.length)
-    console.log('[Workcase] addDynamicRoutes: 路由配置:', routeConfig)
-    console.log('[Workcase] addDynamicRoutes: 路由选项:', routeOptions)
    
    try {
+        // 动态加载 shared 模块
+        const { routeUtils } = await loadSharedModules()
+        const { generateSimpleRoutes } = routeUtils
+        
        // 使用 shared 中的通用方法生成路由
        const routes = generateSimpleRoutes(views, routeConfig, routeOptions)
        
@@ -109,6 +113,7 @@ export function addDynamicRoutes(views: TbSysViewDTO[]) {
        })
        
    } catch (error) {
+        console.error('[Workcase] addDynamicRoutes: 添加路由失败', error)
        throw error
    }
 }
@@ -119,10 +124,14 @@ export function addDynamicRoutes(views: TbSysViewDTO[]) {
 * 使用 shared 中的通用 loadViewsFromStorage 方法
 * 筛选出 service='workcase' 的视图
 */
-export function loadRoutesFromStorage(): boolean {
+export async function loadRoutesFromStorage(): Promise<boolean> {
    try {
        console.log('[Workcase] loadRoutesFromStorage: 开始加载动态路由')
        
+        // 动态加载 shared 模块
+        const { routeUtils } = await loadSharedModules()
+        const { loadViewsFromStorage } = routeUtils
+        
        // 使用 shared 中的通用方法加载视图数据
        const allViews = loadViewsFromStorage('loginDomain', 'userViews')
        
@@ -130,7 +139,7 @@ export function loadRoutesFromStorage(): boolean {
        
        if (allViews) {
            // 过滤出 workcase 服务的视图
-            const workcaseViews = allViews.filter((view: TbSysViewDTO) => 
+            const workcaseViews = allViews.filter((view: any) => 
                view.service === 'workcase'
            )
            
@@ -142,7 +151,7 @@ export function loadRoutesFromStorage(): boolean {
            }
            
            // 使用 Workcase 的 addDynamicRoutes 添加路由
-            addDynamicRoutes(workcaseViews)
+            await addDynamicRoutes(workcaseViews)
            return true
        }
        
--- a/urbanLifelineWeb/packages/workcase/src/router/index.ts
+++ b/urbanLifelineWeb/packages/workcase/src/router/index.ts
@@ -1,11 +1,22 @@
 import { createRouter, createWebHistory, RouteRecordRaw } from 'vue-router'
-// @ts-ignore
-import { TokenManager } from 'shared/api'
-// @ts-ignore
-import { APP_CONFIG } from 'shared/config'
-// @ts-ignore
 import { loadRoutesFromStorage } from './dynamicRoute'

+// 同步检查 token（用于非异步场景）
+function hasTokenSync(): boolean {
+    try {
+        const token = localStorage.getItem('token')
+        return !!token
+    } catch {
+        return false
+    }
+}
+
+// 动态获取 TokenManager
+async function getTokenManager() {
+    const module = await import('shared/api')
+    return module.TokenManager
+}
+
 // 公开路由（不需要登录认证）
 const routes: RouteRecordRaw[] = [
    {
@@ -64,7 +75,8 @@ router.beforeEach(async (to, from, next) => {
                    const newToken = loginDomain.token

                    // 保存到localStorage（覆盖旧的登录状态）
-                    // 只用 TokenManager 存储 token，避免格式不一致
+                    // 动态获取 TokenManager
+                    const TokenManager = await getTokenManager()
                    TokenManager.setToken(newToken)
                    localStorage.setItem('loginDomain', JSON.stringify(loginDomain))

@@ -80,9 +92,9 @@ router.beforeEach(async (to, from, next) => {
        }
    }

-    // 检查是否需要登录
+    // 检查是否需要登录（使用同步方法）
    const requiresAuth = to.meta.requiresAuth !== false
-    const hasToken = TokenManager.hasToken()
+    const hasToken = hasTokenSync()

    console.log('[Workcase Router] 认证检查:', {
        requiresAuth,
@@ -116,41 +128,45 @@ router.beforeEach(async (to, from, next) => {
        })

        dynamicRoutesLoaded = true
-        const loaded = loadRoutesFromStorage?.()
+        try {
+            const loaded = await loadRoutesFromStorage()

-        console.log('[Workcase Router] 动态路由加载结果:', loaded)
-        console.log('[Workcase Router] 当前路径:', to.path)
-        console.log('[Workcase Router] 所有路由:', router.getRoutes().map(r => r.path))
+            console.log('[Workcase Router] 动态路由加载结果:', loaded)
+            console.log('[Workcase Router] 当前路径:', to.path)
+            console.log('[Workcase Router] 所有路由:', router.getRoutes().map(r => r.path))

-        if (loaded) {
-            if (to.path === '/') {
-                // 访问根路径，重定向到第一个可用路由
-                const firstRoute = getFirstAvailableRoute()
-                if (firstRoute && firstRoute !== '/') {
-                    // 只有当第一个路由不是 / 时才重定向，避免无限循环
-                    console.log('[Workcase Router] 根路径重定向到:', firstRoute)
-                    next({ path: firstRoute, replace: true })
-                    return
+            if (loaded) {
+                if (to.path === '/') {
+                    // 访问根路径，重定向到第一个可用路由
+                    const firstRoute = getFirstAvailableRoute()
+                    if (firstRoute && firstRoute !== '/') {
+                        // 只有当第一个路由不是 / 时才重定向，避免无限循环
+                        console.log('[Workcase Router] 根路径重定向到:', firstRoute)
+                        next({ path: firstRoute, replace: true })
+                        return
+                    } else {
+                        // 第一个路由就是 /，直接放行
+                        console.log('[Workcase Router] 第一个路由就是根路径，直接放行')
+                    }
+                } else if (to.path === '/admin') {
+                    // 访问 /admin 路径，重定向到第一个 admin 路由
+                    const firstAdminRoute = getFirstAdminRoute()
+                    if (firstAdminRoute) {
+                        console.log('[Workcase Router] /admin 重定向到:', firstAdminRoute)
+                        next({ path: firstAdminRoute, replace: true })
+                        return
+                    }
                } else {
-                    // 第一个路由就是 /，直接放行
-                    console.log('[Workcase Router] 第一个路由就是根路径，直接放行')
-                }
-            } else if (to.path === '/admin') {
-                // 访问 /admin 路径，重定向到第一个 admin 路由
-                const firstAdminRoute = getFirstAdminRoute()
-                if (firstAdminRoute) {
-                    console.log('[Workcase Router] /admin 重定向到:', firstAdminRoute)
-                    next({ path: firstAdminRoute, replace: true })
+                    // 动态路由加载成功，重新导航以匹配新添加的路由
+                    console.log('[Workcase Router] 动态路由加载成功，重新导航到:', to.path)
+                    next({ ...to, replace: true })
                    return
                }
            } else {
-                // 动态路由加载成功，重新导航以匹配新添加的路由
-                console.log('[Workcase Router] 动态路由加载成功，重新导航到:', to.path)
-                next({ ...to, replace: true })
-                return
+                console.warn('[Workcase Router] 动态路由加载失败')
            }
-        } else {
-            console.warn('[Workcase Router] 动态路由加载失败')
+        } catch (error) {
+            console.error('[Workcase Router] 加载动态路由失败:', error)
        }
    }

--- a/urbanLifelineWeb/packages/workcase/vite.config.ts
+++ b/urbanLifelineWeb/packages/workcase/vite.config.ts
@@ -14,8 +14,11 @@ const DEV_SHARED_URL = 'https://localhost:7000/shared/remoteEntry.js'
 // 生产环境使用相对路径，通过 Nginx 代理访问
 const PROD_SHARED_URL = '/shared/remoteEntry.js'

-export default defineConfig(({ mode }) => {
+export default defineConfig(({ mode, command }) => {
+  // dev 和 preview 都需要访问本地 shared 服务
+  // command: 'serve' (dev), 'build', 或通过环境变量判断 preview
  const isDev = mode === 'development'
+  // preview 模式通过 nginx 代理访问 shared，使用相对路径
  const sharedEntry = isDev ? DEV_SHARED_URL : PROD_SHARED_URL

  return {
@@ -88,19 +91,33 @@ export default defineConfig(({ mode }) => {
        }
      }
    },
-    
+    preview: {
+        port: 7003,
+        host: true,
+        cors: true,
+        https: (() => {
+          try {
+            return {
+              key: fs.readFileSync('C:/Users/FK05/443/localhost+3-key.pem'),
+              cert: fs.readFileSync('C:/Users/FK05/443/localhost+3.pem')
+            }
+          } catch {
+            return undefined
+          }
+        })(),
+        headers: {
+            'Access-Control-Allow-Origin': '*',
+            'Access-Control-Allow-Methods': 'GET, POST, PUT, DELETE, OPTIONS',
+            'Access-Control-Allow-Headers': 'Content-Type, Authorization'
+        }
+    },
    build: {
      target: 'esnext',
      outDir: 'dist',
-      sourcemap: true,
-      rollupOptions: {
-        output: {
-          manualChunks: {
-            'vue-vendor': ['vue', 'vue-router', 'pinia'],
-            'element-plus': ['element-plus']
-          }
-        }
-      }
+      sourcemap: true
+      // 注意：不要使用 manualChunks 分割 vue/vue-router/element-plus
+      // 因为它们已经在 Module Federation 的 shared 中声明
+      // 同时使用会导致循环依赖死锁
    }
  }
 })