vite使用mock插件的配置(vite-plugin-mock)

一、安装依赖

# 使用 npm 安装
npm install mockjs vite-plugin-mock
# 使用 yarn 安装
yarn add mockjs vite-plugin-mock

二、配置

1、在项目的根目录  vite.config,ts

2、在.viteMock文件里面（此处文件是自行创建的） 

import type { Plugin } from 'vite';
import { viteMockServe } from 'vite-plugin-mock';
 
export default function mockPlugin(VITE_USE_MOCK: boolean) {
  return {
    ...viteMockServe({
      mockPath: 'mock',          //mock文件路径，在根路径下创建一个mock文件
      localEnabled: VITE_USE_MOCK, //mock开关
      prodEnabled: false,         //生产环境下为false，这样就不会被打包到生产包中
      ignore: /^\_/,       //忽略开始_路径
    }),
  } as Plugin;
}

3、在根目录创建一个mock文件，下面再细分各种文件，例如创建一个index.ts

export default [
  {
    url: "/api/login",
    method: "post",
    response: () => {
      return {
        code: 200,
        message: "ok",
        data: {success:true}
      };
    }
  }
];

4、调用

  axios.post('/test').then((res) => {
                console.log(res)
            })