viteMockServe 配置

以下是使用 Vite 构建工具的 viteMockServe 插件的基本配置示例：

首先，你需要安装 `vite-plugin-mock` 插件：

npm install -D vite-plugin-mock

然后，在你的 Vite 配置文件（通常是 `vite.config.js`）中，添加 `vite-plugin-mock` 插件并进行相关配置：

// vite.config.js

import { defineConfig } from 'vite';
import { createVuePlugin } from 'vite-plugin-vue';
import viteMockServe from 'vite-plugin-mock';

export default defineConfig({
  plugins: [
    createVuePlugin(),
    viteMockServe({
      // 配置项
      mockPath: 'mock', // mock 文件所在的目录，默认为 'mock'
      supportTs: false, // 是否支持 TypeScript，默认为 false
      ignore: [], // 忽略的文件列表，默认为空数组
      mockExclude: [], // 需要排除的 mock 文件列表，默认为空数组
      watchFiles: true, // 是否监听 mock 文件的变化，默认为 true
      localEnabled: true, // 是否启用本地 mock，默认为 true
      prodEnabled: false, // 是否启用生产环境 mock，默认为 false
      logger: true, // 是否输出日志，默认为 true
    }),
  ],
});

以上配置假设你的 mock 文件存放在项目根目录下的 `mock` 目录中。你可以根据实际情况进行调整。

在 `mock` 目录下，你可以创建一个名为 `example.js` 的文件，用于定义你的接口 mock 数据：

// mock/example.js

export default {
  // GET 请求示例
  'GET /api/example': {
    code: 200,
    message: 'success',
    data: {
      name: 'John Doe',
      age: 30,
    },
  },

  // POST 请求示例
  'POST /api/login': (req, res) => {
    const { username, password } = req.body;
    if (username === 'admin' && password === '123456') {
      res.send({
        code: 200,
        message: 'success',
        data: {
          token: 'your_token_here',
        },
      });
    } else {
      res.send({
        code: 400,
        message: 'Invalid username or password',
      });
    }
  },
};

在这个示例中，我们定义了两个接口：`/api/example` 和 `/api/login`。你可以根据自己的需求进行修改和扩展。

请确保在开发服务器启动后，访问你的接口地址时能够正确返回 mock 数据。

希望这能帮到你！如有任何疑问，请随时提问。