Easy-mock

介绍一款前端mock神器和本地部署方法。

在前端开发中，常见的mock方式有：

• 直接将数据写在代码中
• 利用Charles、 Fiddler等代理工具拦截请求
• 本地起服务

easy-mock属于第三种，并通过mock.js来生成随机数据。mock.js这个库真的是相见恨晚，再也不用自己造那些lowB的数据了。但是直接使用mock.js是比较痛苦的，需要自己搭环境起服务，或者直接写在代码里打包时再删掉。easy-mock就是解决这个问题而产生的，它是一款会员体系 + api信息存储 + mock.js的系统。并且，easy-mock在2017年9月正式开源，意味着我们可以把easy-mock部署在本地或者内部测试环境使用。

本文主要介绍mock.js的常见用法和本地部署easy-mock两部分：

mock.js

Mock.js 的语法规范包括两部分：

• 数据模板定义（Data Temaplte Definition，DTD）
• 数据占位符定义（Data Placeholder Definition，DPD）

数据模板定义主要是介绍模板中的一些特殊规则：
例如：

{
    "name|1":['a','b','c']
}
//从数组中随机抽取一项
//==>{"name":"b"}

{
    "foo|1-2":{a:1,b:2,c:3}
}
//从对象中随机抽取1-2个属性
//===>{"foo":{"a":1,"b":2}}

{
  "code|1": [200, 500],
  "errorMessage": function() {
    if (this.code == 500) {
      return '网络错误，请重新尝试'
    }
    return ''
  }
}
//函数的返回值为最终的属性值

规则有很多啦，详见官方文档
模板可以通过Mock.mock(template)函数来解析。

数据占位符是一个工具类，可以生成各种随机数据
例如：

//生成0-10随机数字
Mock.Random.integer(0, 10)

//随机email
Mock.Random.email()

//...

放个完整的感受一下，其实就几行代码，就能随机生成1-50个item组成的list，并且各个属性还是随机的：

{
  "code": 200,
  "errorMessage": "",
  "data|1-50": [{
    'applicationId|+1': 11,
    'label': '@name',
    'description': '@sentence',
    'version': '@string(7, 10)',
    'created': '@date',
    'modified': '@date',
    'plugins|1-30': [{
      'pluginId': '@integer(1000-9999)'
    }]
  }],
}

easy-mock本地部署

首先拉代码，然后yarn

$ git clone https://github.com/easy-mock/easy-mock.git
$ cd easy-mock && yarn

然后yarn run dev

肯定会报错的:-)
通过一些试错，慢慢就会发现：
环境需要Node.js（>= v8.9）& MongoDB（>= v3.4）& Redis（>= v4.0）等等

mongodb，参考:

#我用sudo brew install mongodb会报错
brew install mongodb

#到根目录创建文件夹，mongodb默认貌似是在根目录找，如何换地方没研究过
cd /
mkdir -p /data/db

#设置权限，要输入密码
#其中-p是创建多个文件目录使用的参数,-R表示对目录进行递归操作，就是data目录下的子文件也设置该权限。
sudo chmod -R admin /data

#启动
mongod

redis：

#安装
brew install redis

#启动
brew services start redis

#停止--如果需要
brew services stop redis

over，谢谢！