vue-admin-better 常见问题快速排查指南：从依赖安装到路由权限-育师

vue-admin-better 常见问题快速排查指南：从依赖安装到路由权限

【免费下载链接】vue-admin-better🎉 vue admin,vue3 admin,vue3.0 admin,vue后台管理,vue-admin,vue3.0-admin,admin,vue-admin,vue-element-admin,ant-design,vab admin pro,vab admin plus,vue admin plus,vue admin pro项目地址: https://gitcode.com/GitHub_Trending/vu/vue-admin-better

vue-admin-better 是一套基于 Vue 2.7 + Element UI 的后台管理框架，内置 RBAC 权限模型、JWT 登录态和 mock 数据，MIT 协议可免费商用。刚 clone 下来跑不通时，坑基本集中在三个阶段：装依赖、本地启动、登录与路由权限。这篇针对 vue-admin-better 常见问题的排查文把坑点做成了速查表——先对症状，再翻到对应小节动手。

项目速览（30 秒）

技术栈：Vue 2.7、Element UI、Vuex、Vue Router，Rspack 构建
启动命令：npm run serve:rspack，默认端口 8090
配置入口：src/config/下的setting.config.js、theme.config.js、net.config.js三个文件，没有 .env 文件
mock 数据：全部在mock/目录，接口默认指向/vab-mock-server

卡点速查表

你看到的现象	大概率卡在哪	去哪修
`pnpm i`卡住或直接报错	网络源，或仓库里缺本地依赖包	"依赖装不上" 一节
启动后 8090 端口打不开	命令写错、端口占用、Node 版本	"启动失败" 一节
登录成功又立刻弹回登录页	token 没写入、接口成功码对不上	"弹回登录页" 一节
登录后菜单空白或进 401 / 404	权限数据为空、`authentication`模式选错	"路由权限" 一节

⚙️ 依赖装不上，先查这 3 件事

git clone https://gitcode.com/GitHub_Trending/vu/vue-admin-better pnpm i --registry=http://mirrors.cloud.tencent.com/npm/

注意两点：

用 pnpm 而不是 npm。仓库里带的是pnpm-lock.yaml，混用包管理器容易装出不一致的依赖树。
package.json里有两个本地依赖：file:layouts和file:vab-icon，它们不在 npm 源上，而是仓库里的子目录。如果 clone 不完整（比如浅克隆、少拉了目录），安装会直接报ENOENT或file:找不到——这种情况删掉重装也没用，补全仓库再装。

💡 网络不稳时换成--registry=https://registry.npmmirror.com，装完仍异常可用npm run clear清空node_modules重装。

🚀 启动失败 / 8090 打不开：按顺序排

确认命令。本项目的开发启动脚本是serve:rspack，不是serve：
```
npm run serve:rspack
```
看端口。开发端口在src/config/setting.config.js的devPort，默认8090。被别的程序占了就改这里，或者杀掉占端口的进程。
看 Node 版本。package.json虽然写着node >= 8.9，但 Rspack 2.x 这条构建链在 Node 16+ 上才稳，版本太低先升级再谈其他。
看报错而不是看白屏。终端里第一处红色报错（常见的是 sass 相关、依赖版本冲突）才是真因，浏览器现象只是结果。
锁步安装兜底：npm run clear会清掉node_modules并用 npmmirror 源重装一遍。

🔑 登录成功又弹回登录页：路由拦截在拦你

登录态的判定逻辑写在src/config/permission.js，流程是：有 token → 调接口拉权限 → 注册动态路由 → 放行。任何一环断了，router.beforeResolve都会把你踢回/login。按下表自查：

配置项	位置	默认值	什么时候要改
`baseURL`	`src/config/net.config.js`	`/vab-mock-server`	接自己的后端时
`successCode`	同上	`[200, 0]`	后端成功码不是 200 / 0 时
`invalidCode`	同上	`402`	登录失效码对不上时
`tokenName`	`src/config/setting.config.js`	`accessToken`	换了 token 字段名时

最常见的两个具体原因：

后端（或 mock）返回的成功码不在successCode里，axios 封装会把成功响应当失败处理，token 根本不会写入。打开浏览器 Application 面板，看 localStorage 里 key 为vue-admin-better-2024的条目存不存在，一眼分辨"接口坏了"还是"判定坏了"。
接了真后端但成功码体系不同，只改successCode一个字段通常就够了，接口地址、成功码、失效码三处都要和后端对一遍。

🧩 登录后菜单空白或 401 / 404：路由权限没对齐

权限模式由src/config/setting.config.js的authentication控制，两个取值：

intelligence（默认）：后端只下发权限码，前端按权限码渲染菜单和路由；
all：路由完全由后端下发，前端只负责加载。

对号入座：

直接进 401：net.config.js里noPermissionCode是401，说明当前用户的权限数组里压根没有这个页面的权限码。先看 mock 侧的数据源mock/controller/user.js，permissions是否为空；接真后端时看接口返回。
进 404：权限有、但路由没注册成功。all模式下完全依赖后端返回的路由结构，字段名、层级和src/store/modules/routes.js里期望的结构对不上就会这样。
菜单空白但页面能点：多数是权限请求发出去了但响应被上面的成功码判定拦下，回到上一节查。