Vue Vben Admin 登录页修改全攻略：从登录界面定制到接口对接全流程配置

前言

Vue Vben Admin 是一个功能强大的 Vue3 + TypeScript 后台管理系统模板，但对于很多开发者来说，如何改造登录页并将其对接到自己的后端系统是一个常见的需求。本文将结合实际仓库代码，详细介绍如何对登录页进行个性化定制，并完成与后端接口的无缝对接。

一、项目结构概览

在开始改造之前，我们需要了解登录页相关的文件结构：

apps/web-antd/ ├── src/ │ ├── layouts/ │ │ └── auth.vue # 登录布局组件 │ ├── views/ │ │ └── _core/ │ │ └── authentication/ │ │ └── login.vue # 登录表单页面 │ └── api/ │ ├── core/ │ │ ├── auth.ts # 登录相关API │ │ └── user.ts # 用户信息API │ └── request.ts # 请求配置 └── vite.co