常见问题

提示 列举了一些常见的问题。有问题可以先来这里寻找,如果没有可以在 issue (opens new window)

# 前言

遇到问题,可以先从以下几个方面查找,百度googleissuesQQ群:328347666

# 项目运行/打包失败,或者安装依赖失败

1、首先确定依赖是否全部安装正确,推荐 yarn或者pnpm 代替 npm,原因嘛,快速高效,稳定,具体可参考官网。

2、找到报错信息,百度,谷歌,解决不了,可以尝试到QQ群,求助。

# 项目怎么对接后端真实接口

1、根目录找到.env.development中VITE_USE_MOCK设置为false

2、.env.development中VITE_GLOB_API_URL设置为后端接口地址

3、 src/enums/httpEnum.ts中ResultEnum枚举,修改成和接口一致状态码

4、 src/utils/http/axios/index.ts大约60行开始(可搜索关键词:“后台统一的字段”),如果接口和项目默认的数据结构不一致,则需要从这里开始修改

5、 src/store/modules/user.ts找到 login 方法做相应的数据结构修改

5、重新运行yarn run dev

提示:如果数据结果一致,登录成功,无法跳转首页 如果数据结果一致,登录成功,无法跳转首页,则需要src/store/modules/user.ts,找到 login 方法详细跟踪一下原因


# 请求失败或者请求成功却拿不到接口数据

1、检查/src/utils/http/index.ts 中 60行左右,可搜索注释 这里 coderesultmessage为 后台统一的字段 是否和接口返回一致

2、检查/src/enums/httpEnum.ts 中的配置,是否和接口一致,必须严格对应,否则都会导致请求失败,或者拿不到数据


# vscode编辑器代码报错

1、安装Volar插件,禁用/卸载Vetur

2、如果是eslint报错变量 / 方法未使用,这个看个人需求了,调整配置,或者禁用 eslint


# tab 页切换后页面空白

这是由于开启了路由切换动画,且对应的页面组件存在多个根节点导致的,在页面最外层添加div即可

如果想使用多个根标签,可以禁用路由切换动画

template 下面的根注释节点也算一个节点


# 为什么在mock模块加文件还是404

mock里面的文件,不支持热重载,得 yarn run dev 一下vite重启很快的


# 为什么是 date-fns

为了和UI组件库底层保持一致,因为,moment.js 和 day.js格式化和date-fns有所差异,也是为了避免出现不必要的bug


# 为什么配置 keepalive 无效

如果页面语法是,script setup那么需要在上面在写一个export default { name: 'pageName' }

如果不是,那就在defineComponent中定义name就好了