webpack在client端实现mock

148 阅读1分钟

安装 webpack-api-mocker

yarn add webpack-api-mocker -D

在client下新建文件夹mock

修改webpack中的配置

const apiMocker = require('webpack-api-mocker');
devServer: {    
    before (app) {      
       apiMocker(app, path.resolve(__dirname, './mock/index.js'))    
    }  
}

axios发送请求baseURL修改为client端服务的host地址

const instance: AxiosInstance = axios.create({  
baseURL: 'http://127.0.0.1:8080/',
...............
});

填写mock数据

最后是在mock文件夹下index.js文件中,对应的路径,写上返回的mock信息,如下:

const proxy = {    
    'GET /test': { data: 'success' }
};
module.exports = proxy;

当代码中调用/test请求时,可以获得对应的mock数据