前端本地mock数据gulp工具gulp-mock-sever

在前端开发和调试过程中经常会碰到服务器不稳定的问题,就考虑到若是能在本地开启一个用来mock数据的服务器就好了。于是便产生了gulp-mock-server工具,工具特点如下

一.简单易用

对服务器进行简单配置,开启服务后,项目根目录下创建一个命名为data的文件夹,把需要mock的json数据丢到里面,访问连接就能直接访问到
例如:文件路径'/data/test.json'对应访问url是'域名+/test'

二.支持jsonp

对于跨于访问,不支持jsonp那可不行,工具当然为你想到了,无需配置,天然支持jsonp

三.支持内嵌目录

为了data文件夹下的mock数据易于维护和整理,工具支持data文件夹下内嵌目录.
例如:文件路径'/data/class/xiaoming.json'对应访问url是'域名+/class/xiaoming'

四.支持url访问路径相同,参数关键字不同,访问文件不同

如果是get请求参数带有关键字/test?mt=123,那么最终访问的data下的文件名为test123.json,post请求和这个一样

具体使用方式:

  1. 安装 npm install --save-dev gulp-mock-server

  2. 根目录下新建命名为data的文件夹,放入要mock的json文件,例如:test.json

  3. gulpfile配置webserver

  4. 启动gulp任务,访问路径 localhost:8090/test

gulp配置代码如下:

var gulp = require('gulp');
var mockServer = require('gulp-mock-server');

gulp.task('mock', function() {
  gulp.src('.')
    .pipe(webserver({
      livereload: false,
      directoryListing: true,
      port: 8090,
      open: true
    }));
});

最后

gulp-mock-server的很多特点都是自己在使用过程中不断加进来的,这个项目我也会一直维护,希望大家有什么好的建议都可以提给我。开源地址

推荐两篇好文:
http://segmentfault.com/a/1190000002668509
http://segmentfault.com/a/1190000002413526

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

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

余额充值