xiaozhang/guoyu
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity
664cc3c752
guoyu/log/问题/问题记录.md

15 KiB
Raw Blame History

问题记录

问题记录格式

使用双链形式连接步骤文档，例如：第一阶段-基础架构搭建

问题文档索引

问题列表

问题1

  • 关联步骤：第一阶段-基础架构搭建
  • 问题描述：编译错误 - lombok和Spring包找不到
  • 发生时间：2025-11-10
  • 错误信息：
    • java: 程序包lombok不存在
    • java: 找不到符号 符号: 类 Data
    • java: 程序包org.springframework.web.bind.annotation不存在
  • 问题原因：
    1. pom.xml中第18行有错误标签<n>，应该是<name>
    2. Maven无法正确解析pom.xml，导致依赖无法下载
    3. IDE没有识别为Maven项目
  • 解决方案：
    1. 修复pom.xml中的错误标签（删除错误的<n>标签）
    2. 在IDE中重新加载Maven项目
    3. 安装Lombok插件（IntelliJ IDEA）
    4. 启用注解处理
    5. 重新构建项目
  • 状态：已解决

问题2

  • 关联步骤：第一阶段-基础架构搭建
  • 问题描述：泛型类型推断错误 - Result类型不兼容
  • 发生时间：2025-11-10
  • 错误信息：
    • java: 不兼容的类型: 推论变量T具有不兼容的限制范围
    • 等式约束条件: java.lang.Void
    • 下限: java.lang.String
  • 问题原因：
    1. 当返回类型是Result<Void>时，调用Result.success("消息")会导致类型推断冲突
    2. success(String message, T data)方法期望第二个参数是T类型，但传入String时与Void冲突
  • 解决方案：
    1. 在Result类中添加success(String message)方法，专门用于返回无数据的成功响应
    2. 该方法只接受消息参数，data为null，避免类型推断冲突
  • 状态：已解决

问题3

  • 关联步骤：第一阶段-基础架构搭建
  • 问题描述：Vue管理后台npm依赖冲突 - @vitejs/plugin-vue版本不兼容
  • 发生时间：2025-11-10
  • 错误信息：
    • npm error ERESOLVE unable to resolve dependency tree
    • peer vite@"^3.0.0" from @vitejs/plugin-vue@3.2.0
    • Found: vite@4.5.14
  • 问题原因：
    1. 项目使用vite@^4.0.0，但@vitejs/plugin-vue@^3.0.0只支持vite@^3.0.0
    2. 版本不匹配导致依赖冲突
  • 解决方案：
    1. 将@vitejs/plugin-vue从^3.0.0升级到^4.0.0，以兼容vite 4.x
    2. 添加@element-plus/icons-vue依赖
    3. 修复vite.config.js中的路径解析（使用ES模块方式）
    4. 修复layout中的图标导入
  • 状态：已解决

问题4

  • 关联步骤：第一阶段-基础架构搭建
  • 问题描述：UniApp项目npm依赖冲突 - Vue版本不兼容
  • 发生时间：2025-11-10
  • 错误信息：
    • npm error ERESOLVE unable to resolve dependency tree
    • peer vue@">= 2.5 < 2.7" from @vue/composition-api@1.7.2
    • Found: vue@3.5.24
  • 问题原因：
    1. 项目使用Vue 3，但@dcloudio/uni-app的某些版本依赖@vue/composition-api
    2. @vue/composition-api只支持Vue 2.x，与Vue 3不兼容
    3. 使用了"latest"标签导致安装了不兼容的版本
  • 解决方案：
    1. 指定UniApp相关依赖的具体版本，使用支持Vue 3的版本
    2. 使用@dcloudio/vite-plugin-uni和相关包的alpha版本（支持Vue 3）
    3. 固定Vue版本为3.2.47（稳定版本）
    4. 如果仍有问题，可以使用npm install --legacy-peer-deps
  • 状态：已解决

问题5

  • 关联步骤：第一阶段-基础架构搭建
  • 问题描述：UniApp项目npm依赖冲突 - Vite版本不兼容
  • 发生时间：2025-11-10
  • 错误信息：
    • npm error ERESOLVE unable to resolve dependency tree
    • peer vite@"5.2.8" from @dcloudio/vite-plugin-uni@3.0.0-alpha-4080420251023001
    • Found: vite@4.5.14
  • 问题原因：
    1. @dcloudio/vite-plugin-uni的alpha版本需要vite@5.2.8
    2. 项目配置的vite版本为^4.5.0，版本不匹配
  • 解决方案：
    1. 将vite版本从^4.5.0升级到^5.2.8，以匹配@dcloudio/vite-plugin-uni的要求
    2. 如果仍有问题，可以使用npm install --legacy-peer-deps
  • 状态：已解决

问题6

  • 关联步骤：第一阶段-基础架构搭建
  • 问题描述：UniApp项目运行错误 - 找不到manifest.json文件
  • 发生时间：2025-11-10
  • 错误信息：
    • Error: ENOENT: no such file or directory, open 'D:\0_Project\02_Study\frontend-uniapp\src\manifest.json'
  • 问题原因：
    1. UniApp CLI工具要求所有源文件必须在src目录下
    2. 项目创建时文件放在了根目录，不符合UniApp的项目结构要求
  • 解决方案：
    1. 创建src目录
    2. 将manifest.json、pages.json、App.vue、main.js移动到src目录
    3. 将pages、store、utils等目录移动到src目录
    4. 保持项目结构符合UniApp标准
  • 状态：已解决

问题7

  • 关联步骤：第一阶段-基础架构搭建
  • 问题描述：UniApp H5开发服务器启动后浏览器无法访问
  • 发生时间：2025-11-10
  • 错误信息：
    • Vite dev server运行在http://localhost:5173/，但浏览器无法访问
    • 警告：Could not auto-determine entry point from rollupOptions or html files
  • 问题原因：
    1. 缺少vite.config.js配置文件，导致无法正确确定入口点
    2. manifest.json中的devServer端口配置与Vite默认端口不一致
    3. 缺少路径别名配置，导致@别名无法解析
  • 解决方案：
    1. 创建vite.config.js文件，配置入口点、路径别名、服务器设置
    2. 更新manifest.json中的devServer配置，端口改为5173，添加host: "0.0.0.0"和open: true
    3. 配置optimizeDeps.include以解决依赖预构建警告（只包含第三方库，不包含vue、vuex）
    4. 配置路径别名@指向src目录
  • 状态：已解决

问题8

  • 关联步骤：第一阶段-基础架构搭建
  • 问题描述：UniApp H5开发服务器启动错误 - entry point cannot be marked as external
  • 发生时间：2025-11-10
  • 错误信息：
    • The entry point "vue" cannot be marked as external
    • The entry point "vuex" cannot be marked as external
  • 问题原因：
    1. 在vite.config.js的optimizeDeps.include中包含了vue和vuex
    2. UniApp的vite插件会将vue和vuex标记为external，不能同时包含在optimizeDeps.include中
    3. 这会导致构建冲突
  • 解决方案：
    1. 从optimizeDeps.include中移除vue和vuex
    2. 只保留第三方UI库（如uview-ui）在optimizeDeps.include中
    3. 让UniApp插件自动处理核心依赖的优化
  • 状态：已解决

问题9

  • 关联步骤：第一阶段-基础架构搭建
  • 问题描述：UniApp H5开发服务器启动后访问根路径出现404错误
  • 发生时间：2025-11-10
  • 错误信息：
    • 找不到此 localhost 页面找不到 Web 地址对应的网页: http://localhost:5173/
    • HTTP ERROR 404
  • 问题原因：
    1. 缺少index.html入口文件，Vite需要HTML文件作为入口
    2. vite.config.js中proxy target配置有多余空格
    3. host: '0.0.0.0'可能导致某些环境下的访问问题
    4. UniApp的vite插件可能没有自动生成入口HTML文件
  • 解决方案：
    1. 在项目根目录创建index.html文件，指向/src/main.js
    2. 修复vite.config.js中proxy target的空格问题
    3. 将host从'0.0.0.0'改为'localhost'（如果需要外部访问，可以改回）
    4. 简化vite.config.js配置，移除不必要的build配置
    5. 重新启动开发服务器
  • 状态：已解决

问题10

  • 关联步骤：第一阶段-基础架构搭建
  • 问题描述：UniApp H5开发服务器编译错误 - 缺少sass预处理器
  • 发生时间：2025-11-10
  • 错误信息：
    • [plugin:vite:css] Preprocessor dependency "sass" not found. Did you install it?
    • Try npm install -D sass
  • 问题原因：
    1. App.vue中使用了<style lang="scss">，需要sass预处理器
    2. 项目依赖中没有安装sass包
    3. uView UI的样式文件也是scss格式，需要sass编译
  • 解决方案：
    1. 运行npm install -D sass安装sass预处理器
    2. 将sass添加到package.json的devDependencies中
    3. 重新启动开发服务器
  • 状态：已解决

问题11

  • 关联步骤：第一阶段-基础架构搭建
  • 问题描述：UniApp H5开发服务器编译错误 - uView UI SCSS变量未定义
  • 发生时间：2025-11-10
  • 错误信息：
    • [sass] Undefined variable: $u-border-color
    • node_modules\uview-ui\libs\css\common.scss 38:16
  • 问题原因：
    1. uView UI的变量定义在theme.scss文件中
    2. 在导入index.scss之前没有先导入theme.scss
    3. 导致common.scss中使用的变量（如$u-border-color）未定义
  • 解决方案：
    1. 在App.vue的<style>标签中，先导入uview-ui/theme.scss
    2. 然后再导入uview-ui/index.scss
    3. 确保变量在使用前已经定义
  • 状态：已解决（后续替换为uView Plus）

问题12

  • 关联步骤：第一阶段-基础架构搭建
  • 问题描述：UniApp H5运行时错误 - Vue.filter is not a function
  • 发生时间：2025-11-10
  • 错误信息：
    • Uncaught TypeError: Vue.filter is not a function
    • at Object.install (index.js:65:9)
  • 问题原因：
    1. 项目使用Vue 3，但uView UI 2.x是为Vue 2设计的
    2. Vue 3移除了Vue.filter API，而uView UI使用了这个API
    3. uView UI 2.x与Vue 3不兼容
  • 解决方案：
    1. 卸载uview-ui（Vue 2版本）
    2. 安装uview-plus（Vue 3版本）
    3. 更新main.js中的导入：import uviewPlus from 'uview-plus'
    4. 更新App.vue中的样式导入：先导入uview-plus/theme.scss，再导入uview-plus/index.scss
    5. 更新pages.json中的easycom配置：uview-plus/components/u-$1/u-$1.vue
  • 状态：已解决

问题13

  • 关联步骤：第一阶段-基础架构搭建
  • 问题描述：UniApp H5编译错误 - uView Plus SCSS变量未定义
  • 发生时间：2025-11-10
  • 错误信息：
    • [sass] Undefined variable: $u-border-color
    • node_modules\uview-plus\libs\css\common.scss 40:16
  • 问题原因：
    1. uView Plus的变量定义在theme.scss文件中
    2. 在导入index.scss之前没有先导入theme.scss
    3. 导致common.scss中使用的变量（如$u-border-color）未定义
  • 解决方案：
    1. 在App.vue的<style>标签中，先导入uview-plus/theme.scss
    2. 然后再导入uview-plus/index.scss
    3. 确保变量在使用前已经定义
  • 状态：已解决

问题14

  • 关联步骤：第一阶段-基础架构搭建
  • 问题描述：UniApp H5编译错误 - 无法解析uview-ui组件导入
  • 发生时间：2025-11-10
  • 错误信息：
    • Failed to resolve import "uview-ui/components/u-input/u-input.vue"
    • from "src/pages/login/login.vue"
  • 问题原因：
    1. 项目已从uview-ui迁移到uview-plus
    2. Vite缓存中仍然保存了旧的uview-ui路径引用
    3. 即使pages.json已更新，缓存仍在使用旧配置
  • 解决方案：
    1. 清除Vite缓存：删除node_modules/.vite目录
    2. 重启开发服务器
    3. 确保pages.json中的easycom配置指向uview-plus
  • 状态：已解决

问题15

  • 关联步骤：第一阶段-基础架构搭建
  • 问题描述：UniApp H5编译错误 - uView Plus组件样式变量未定义
  • 发生时间：2025-11-10
  • 错误信息：
    • [sass] Undefined variable: $u-info
    • node_modules\uview-plus\components\u-button\vue.scss 12:37
  • 问题原因：
    1. uView Plus的组件样式文件（如u-button/vue.scss）中使用了主题变量
    2. 这些变量只在App.vue中导入，组件的样式文件无法访问到
    3. 每个组件的样式文件都需要访问主题变量，但无法共享App.vue中的导入
  • 解决方案：
    1. 在vite.config.js的css.preprocessorOptions.scss中添加additionalData
    2. 配置为自动在每个SCSS文件前导入uview-plus/theme.scss
    3. 这样所有SCSS文件（包括组件样式）都能访问到主题变量
  • 状态：已解决

问题16

  • 关联步骤：第一阶段-功能实现记录
  • 问题描述：管理后台ECharts集成时图标组件未导入
  • 发生时间：2025-11-10
  • 错误信息：
    • 控制台报错：Uncaught (in promise) Error: Component "TrendCharts" is not defined
  • 问题原因：
    1. 在侧边栏菜单中使用了TrendCharts图标组件
    2. 但忘记在layout文件中导入和注册该组件
    3. 导致Vue无法识别该组件
  • 解决方案：
    1. 在layout/Index.vue中导入TrendCharts组件：import { TrendCharts } from '@element-plus/icons-vue'
    2. 在components选项中注册该组件
    3. 确保所有使用的图标组件都正确导入
  • 状态：已解决

问题17

  • 关联步骤：第一阶段-功能实现记录
  • 问题描述：WebSocket连接被Spring Security拦截
  • 发生时间：2025-11-10
  • 错误信息：
    • WebSocket连接请求返回403 Forbidden
    • 控制台报错：WebSocket connection to 'ws://localhost:8080/ws/monitor/123' failed: HTTP Authentication failed; no valid credentials available
  • 问题原因：
    1. Spring Security默认拦截所有请求，包括WebSocket连接
    2. 未为WebSocket路径配置免认证访问
    3. WebSocket连接无法通过认证
  • 解决方案：
    1. 在SecurityConfig.java中添加WebSocket路径的免认证配置
    2. 添加配置：.antMatchers("/ws/**").permitAll()
    3. 允许所有WebSocket连接请求通过
  • 状态：已解决

问题18

  • 关联步骤：第一阶段-功能实现记录
  • 问题描述：UniApp横屏配置不生效
  • 发生时间：2025-11-10
  • 错误信息：
    • 应用始终保持竖屏显示，无法切换到横屏
    • 控制台没有明显错误
  • 问题原因：
    1. 只配置了manifest.json中的横屏支持，但缺少pages.json中的页面级配置
    2. 需要在页面级别明确指定支持的屏幕方向
    3. 缺少屏幕方向的监听和控制逻辑
  • 解决方案：
    1. 在pages.json的globalStyle.app-plus中添加横屏配置
    2. 在需要横屏的具体页面（如课程详情页）的style.app-plus中添加横屏配置
    3. 创建orientation.js工具类，实现屏幕方向监听和控制
    4. 在课程详情页中集成方向监听逻辑
  • 状态：已解决

问题19

  • 关联步骤：第一阶段-功能实现记录
  • 问题描述：管理后台统计分析页面点击没有反应
  • 发生时间：2025-11-10
  • 错误信息：
    • 控制台报错：Uncaught (in promise) ReferenceError: ref is not defined
    • 页面空白或无法渲染
  • 问题原因：
    1. ECharts.vue组件中使用了ref函数
    2. 但忘记从Vue中导入ref
    3. 导致组件初始化失败，从而使统计分析页面无法显示
  • 解决方案：
    1. 在ECharts.vue中添加ref的导入：import { computed, watch, onMounted, ref } from 'vue';
    2. 确保所有使用的Vue API都正确导入
  • 状态：已解决