huangzhenbao/medical-mall

Fork 0

Files

huangzhenbao 21f4a0fa96 修改页面结构

2026-02-02 20:07:37 +08:00

3.6 KiB

Raw Blame History

System-Info 页面侧边栏问题完整解决方案

问题现象

refresh-cache.uvue、online-upgrade.uvue、system-log.uvue 添加 AdminLayout 导入后工作正常
system-info.uvue 添加相同的导入后仍然没有侧边栏
浏览器控制台显示 "Failed to resolve component: AdminLayout"

问题分析

1. 已确认正确的部分

✅ nav.uts 匹配逻辑正确（通过测试脚本验证）
✅ menu.uts 中 system-info 配置正确
✅ AdminLayout.uvue 逻辑正确
✅ tsconfig.json 中 @ 别名配置正确
✅ pages.json 中路由配置正确

2. 可能的原因

原因 1: 浏览器缓存

H5 开发时，浏览器可能缓存了旧版本的 system-info.uvue

原因 2: HBuilderX/vite 编译缓存

编译器可能缓存了有问题的版本

原因 3: 文件编码或隐藏字符

system-info.uvue 可能有不可见的特殊字符导致解析失败

原因 4: 热更新问题

开发服务器的热更新可能没有正确处理这个文件

完整解决步骤

步骤 1: 清理缓存

# 在项目根目录执行
Remove-Item -Recurse -Force unpackage\dist -ErrorAction SilentlyContinue
Remove-Item -Recurse -Force .hbuilderx\cache -ErrorAction SilentlyContinue
Remove-Item -Recurse -Force node_modules\.vite -ErrorAction SilentlyContinue

步骤 2: 重新构建 system-info.uvue

完全删除并重新创建文件，确保没有隐藏字符

步骤 3: 验证文件内容

使用以下命令检查文件编码：

Get-Content "d:\骅锋\mall\pages\mall\admin\maintain\system-info.uvue" -Encoding UTF8 | Measure-Object -Line

步骤 4: 重启开发服务器

停止当前的 dev:h5 进程（Ctrl+C）
清理浏览器缓存（Ctrl+Shift+Delete）
重新启动: npm run dev:h5

步骤 5: 强制刷新浏览器

访问 system-info 页面时使用 Ctrl+Shift+R 强制刷新

备用方案

如果上述步骤无效，尝试以下方案：

方案 A: 使用相对路径导入

将 system-info.uvue 中的导入改为：

import AdminLayout from "../../../layouts/admin/AdminLayout.uvue";

方案 B: 检查文件名大小写

确保文件名完全匹配（包括大小写）：

文件: system-info.uvue
menu.uts: id: 'system-info'
currentPage: "system-info"

方案 C: 使用其他工作文件作为模板

复制 refresh-cache.uvue 的内容，只修改必要的部分：

Copy-Item "d:\骅锋\mall\pages\mall\admin\maintain\security\refresh-cache.uvue" "d:\骅锋\mall\pages\mall\admin\maintain\system-info-new.uvue"
# 然后手动修改 system-info-new.uvue 的内容
# 测试通过后重命名回 system-info.uvue

调试工具

浏览器控制台诊断脚本

在浏览器控制台运行 d:\骅锋\mall\debug-system-info-browser.js 的内容

Node.js 测试脚本

node "d:\骅锋\mall\test-system-info-nav.js"

预期结果

修复后，访问 system-info 页面应该：

显示主侧边栏（"维护"菜单高亮）
显示二级侧边栏（包含"系统信息"等子菜单）
面包屑显示：维护 / 系统信息
没有 "Failed to resolve component: AdminLayout" 错误

验证清单

浏览器控制台无错误
Vue DevTools 中能看到 AdminLayout 组件
主侧边栏显示且 "维护" 高亮
二级侧边栏显示
面包屑正确显示
页面内容正常渲染

3.6 KiB Raw Blame History Unescape Escape