express-kv-api

express插件:key-value 形式,简单模拟api,结合 mockjs 更灵活。最简单的后端请求模拟方式,可用于前端本地测试。

Usage no npm install needed!

<script type="module">
  import expressKvApi from 'https://cdn.skypack.dev/express-kv-api';
</script>

README

express-kv-api

express插件:key-value 形式,简单模拟api,结合 mockjs 更灵活。最简单的后端请求模拟方式,可用于前端本地测试。

Installation

npm install express-kv-api --save-dev

Usage

Server

for express


const bodyParser = require('body-parser')
const kvApi = require('express-kv-api')
const express = require('express')

const path = require('path')
const process = require('process')

const app = express()

app.use(bodyParser.urlencoded({ extended: false }))
app.use(bodyParser.json())
app.use(kvApi({
  // 接口文件夹路径,默认为项目下的`server`文件,支持 json/js 文件
  dirPath: path.join(process.cwd(), 'server'),
  // 是否监听接口文件夹内变动,默认true
  watch: true,
  // 数据处理函数,可用于统一的数据包装,默认直接返回data
  dataWrap (data) {
    return {
      success: true,
      data: data,
      message: '请求成功',
    }
  },
  // 返回对象用于「函数」类型value,以下为默认方式
  reqDataWrap (req, params) {
    return {
      params,
      ...req.params,
      ...req.query,
      ...req.body
    }
  },
  // 以目录结构划分模块
  moduleByPath: false,
  // 请求的默认方法,默认为all
  defaultMathod: 'post'
}))

app.listen(8080)
...

for webpack-dev-server

const bodyParser = require('body-parser')
const kvApi = require('express-kv-api')

const config = {
  ...,
  after (app) {
    app.use(bodyParser.urlencoded({ extended: false }))
    app.use(bodyParser.json())
    app.use(kvApi())
  }
}

for @vue/cli-service

const bodyParser = require('body-parser')
const kvApi = require('express-kv-api')

const config = {
  ...,
  devServer: {
    ...,
    after (app) {
      app.use(bodyParser.urlencoded({ extended: false }))
      app.use(bodyParser.json())
      app.use(kvApi())
    }
  }
}

for vuepress@1.x

const config = {
  ...,
  beforeDevServer (app) {
    app.use(kvApi())
  }
}

API

接口文件,可获取到请求参数,做简单逻辑处理。 请求地址按express格式, 返回数据按mock语法规范。 书写示范:

module.exports = {
  /**
   * 指明method为post,默认为all
   * 延迟1000ms请求返回
   */
  'post|1000 /api/add': true,
  /**
   * function形式,将参数传入
   * {
   *  params:[],
   *  ...req.query,
   *  ...req.body,
   * }
   */
  '/api/service/(getAll|getList)' (data) {
    return {
      type: data.params[0],
      id: data.id,
      'child|2-8': [
        {
          'id|+1': data.id * 100,
          name: 'test3',
        }
      ]
    }
  },
}