webpack配置代理服务proxy

背景

在使用webpack搭建一个项目的时候，本地开发mock接口数据是不可避免的，
mock的方式有多种，比如mock.js、webpack的proxy代理。
本文主要是使用proxy而且代理的是本地的数据。

开始

我们都知道webpack在开发环境有devServer的配置

const proxy = {
  '/test/*': {
    target: 'http://yapi.afpai.com/mock/768', // 源地址
    changeOrigin: true, // 改变源
    ws: true,
    pathRewrite: {
      '^/api': ''
    }
  },
  // 起一个本地服务且有study目录
  '/study/*': {
    target: 'http://localhost:70',
    changeOrigin: true, // 改变源
  }
};
devServer: {
    contentBase: './src',
    hot: true,
    proxy: proxy
 },
 注意target的值需要加上协议（被坑过）

一般公司会有接口文档平台，在上面可以mock接口数据，但是假如我们自己玩呢，同理我们可不可以代理本地的数据呢。
答案当然可以，我们只需要起一个本地服务（这里我用的是apache），确保指定目录下有接口路径对应的文件就好了。这里我的是.php文件。

缀述

apache–文件不带扩展名访问