james-mock-plugin

English

一个使用koa和koa-router建立mock server的webpack插件。

使用场景

我们平时在开发项目时，因为是前后端分离的模式，当接口没写完时，我们常常需要自己去mock数据。这个插件的作用就是起一个node服务，并把你的接口指向你创建的mock文件，并返回其中的数据。

使用

安装

    // use npm 
    npm install webpack james-mock-plugin --save-dev
    // use yarn
    yarn add webpack james-mock-plugin --save-dev

配置

1. webpack 配置如下：

// 自定义plugin
const WebpackEasyMockPlugin = require('./server');
// 路由map
const config = require('./mock/config.js');

// 端口号
let serverPort = 5000;
let clientPort = 8080;

{
    plugins: [
        new WebpackEayMockPlugin({
            config,
            port: serverPort
        })
    ],
    devServer: {
        ...WebpackEasyMockPlugin.config(clientPort, serverPort)
    }
}

2. mock配置

const path = require('path');

const config = {
    '/api/demo01': {
        data: {
            demo01: 1
        }
    },
    '/api/demo02': {
        path: path.join(__dirname, './data/demo02.json')
    },
};

module.exports = config;

3.说明

options.port mock server 监听的端口，需不同于项目端口。

options.config mock 数据的配置。key 是路径，就是对应 koa 的路由。 值是 mock 数据，可以用 data 返回数据，也可以通过 path 指定 mock 文件位置。mock 文件为 json 文件。