Vite plugins学习之手写 alias 插件

/**
 * @description: vite mock 插件
 * 做的最主要的事情就是拦截 http 请求
 */

const fs = require("fs");
const path = require("path");

function getMockResult() {
  let mockResult = [];
  const mockState = fs.statSync("mock");
  const isDirectory = mockState.isDirectory();
  if (isDirectory) {
    // process.cwd() --> 获取到当前执行的根目录
    mockResult = require(path.resolve(process.cwd(), "mock/index.js"));
  }
  return mockResult;
}

module.exports = (options) => {
  // 我们使用fetch 或 axios 请求,当打给本地的开发服务器时,Vite Server 服务接管
  return {
    // 配置开发服务器的钩子,常见的用例是在内部 connect 应用程序中添加自定义中间件
    configureServer(server) {
      // req:请求对象 -> 请求头、请求体、URL、cookie
      // res:响应对象 -> 响应头、响应体、状态码、cookie
      // next: 是否交给下一个中间件
      server.middlewares.use((req, res, next) => {
        const existItem = getMockResult().find((t) => t.url === req.url);
        if (existItem) {
          const response = existItem.response(req);
          res.setHeader("Content-type", "application/json;charset=utf-8");
          res.end(JSON.stringify(response));
        } else {
          next();
        }
      });
    },
  };
};

  • 1
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 打赏
    打赏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包

打赏作者

Iam_楠

你的鼓励将是我创作的最大动力

¥1 ¥2 ¥4 ¥6 ¥10 ¥20
扫码支付:¥1
获取中
扫码支付

您的余额不足,请更换扫码支付或充值

打赏作者

实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值