项目结构mock/├── index.ts # Mock 入口└── modules/└── index.ts # 登录 Mock 数据src/├── utils/│ ├── request.ts # Axios 封装│├── api/│ ├── modules/│ └── auth.ts # 认证工具,放了登陆相关接口││└── store/└── modules/└── user.ts # 用户状态管理└── index.ts1.引入Pinianpm install pinia2.引入mock、axios:npm install vite-plugin-mock -Dnpm install mockjsnpm install axios配置mockvite.config.tsimport { defineConfig } from vite import vue from vitejs/plugin-vue // 引入自动导入组件插件 import Components from unplugin-vue-components/vite // 引入 Ant Design Vue的解析器 import { AntDesignVueResolver } from unplugin-vue-components/resolvers // 引入mock import { viteMockServe } from vite-plugin-mock import path from path // https://vite.dev/config/ export default defineConfig({ plugins: [ vue(), Components({ resolvers: [ AntDesignVueResolver({ // 按需加载样式 importStyle: false, // 如果需要加载图标库可以开启 resolveIcons: true }) ] }), viteMockServe({ mockPath: mock, // mock文件存放目录 enable: true, // 是否启用mock logger: true // 控制台显示请求日志 }) ] })3. npm install types/node配置上路径(vite.vonfig.ts中与plugins同级)resolve: { alias: { : path.resolve(__dirname, ./src) } }// tsconfig.node.json { compilerOptions: { ...其他配置 baseUrl: ., paths: { /*: [./src/*] } }, include: [vite.config.ts] }// tsconfig.app.json { compilerOptions: { ...其他配置 baseUrl: ., paths: { /*: [./src/*] } }, include: [src/**/*.ts, src/**/*.tsx, src/**/*.vue] }最后按照项目结构加上对应的文件夹和文件