# mockcat

**Repository Path**: xiongrj/mockcat

## Basic Information

- **Project Name**: mockcat
- **Description**: Mockcat是一款前端与后台分离开发的简易的接口Mock数据工具。提供了Mock数据的模块化管理，接口数据的定义（支持带注释的JSON数据，自带JSON数据编辑器），以及数据的Mock服务功能。另外还提供了开发中常用的一些工具及收藏了工具类的网站。
- **Primary Language**: NodeJS
- **License**: Apache-2.0
- **Default Branch**: master
- **Homepage**: None
- **GVP Project**: No

## Statistics

- **Stars**: 0
- **Forks**: 44
- **Created**: 2018-08-25
- **Last Updated**: 2020-12-19

## Categories & Tags

**Categories**: Uncategorized

**Tags**: None

## README

# Mockcat 开发工具集

### 项目简介
Mockcat是一款前端与后台分离开发的简易的接口Mock数据工具。提供了Mock数据的模块化管理，接口数据的定义（支持带注释的JSON数据，自带JSON数据编辑器），以及数据的Mock服务功能。另外还提供了开发中常用的一些工具及收藏了工具类的网站。


### 安装运行

1.安装[Node.js](https://nodejs.org/en/)

2.在控制台执行以下命令：

  > npm install

  > npm start


### 使用说明

**1.添加Mock数据模块**

点击【添加模块】按钮可添加新的Mock数据模块。对于已添加的数据模块可以修改和删除。

![MockModule](https://images.gitee.com/uploads/images/2018/0822/164804_cfce8fb3_409346.png "mock-module.png")

**2.Mock数据文件编辑**

点击【MOCK数据模块】页面中的模块名进入到Mock数据的编辑页面。Mock数据的存储使用的文件系统存储的，与URL路径相对应，Mock数据的操作与文件操作相同。选择目录树的结点，可以添加、修改或删除结点，点击【复制】按钮，在列表中可选择不同的操作复制数据、文件或文件夹，点击【打开链接地址】可查看Mock数据或文件列表。

![MockEditor](https://images.gitee.com/uploads/images/2018/0822/164839_75041086_409346.png "mock-editor.png")

**3.Mock数据编辑器**

Mock数据目录只支持JSON格式的数据，但可以在JSON数据中加入注释。一般会添加文件的头注释（对接口进行说明），也可以对字段进进注释（说明字段的含义）。*注：/\*\*/注释不能嵌套，注释和数据编辑都可以使用快捷键操作，参照如下的快捷键列表。*

  3.1全屏与查找替换

  ![Editor](https://images.gitee.com/uploads/images/2018/0822/164904_0fb434c1_409346.png "editor.png")

  3.2支持的快捷键列表

  ![ShortcutKey](https://images.gitee.com/uploads/images/2018/0822/164930_ca48315f_409346.png "shortcut-key.png")

**4.数据的Mock服务**

开发过程中前端与后台开发都可协商修改接口数据结构，编辑好的Mock可以用于前端开发页面使用了。选择不同的目录结点，点击【打开链接地址】可查看Mock数据，如图所示。待后台开发完成后可将服务器地址切换到开发服务器进行调试了。*注：编辑器没有对带注释的JSON作强校验，Mock数据必须保证它能正确的解析成JSON数据。*

![MockDirectory](https://images.gitee.com/uploads/images/2018/0822/165001_366757fc_409346.png "mock-directory.png")

![MockData](https://images.gitee.com/uploads/images/2018/0822/165017_ff1174c3_409346.png "mock-data.png")

### 其他工具

#### APIDOC文档注释
输入对应的注释参数，可生成[apiDoc](http://apidocjs.com/)文档注释。

#### JSON格式化
格式化JSON数据，并且可以校验JSON数据结构的正确性。

#### SQL参数匹配
针对MyBatis的SQL日志，将Preparing与Parameters进行匹配。

#### JS模板代码
基于Underscore.js模板语法，可以将JSON格式的数据填充到模板中，生成自定义的模板代码。

#### 工具网站收藏
收藏了一些开发中常用的工具网站。