Mockjs-esm 项目

3.0.0 版本开始编写，准备全面改动。 现在支持 typescript 版本啦！虽然是 Beta 版本，但是已经实现了大部分功能！一天半爆肝完成改写！ 完成 Random 部分的测试，测试报告, 这份报告是直接获取项目中的代码并进行前端 typescript 打包生成的！

简介

Mockjs-esm 是 Mockjs 的 typescipt 版本，由于 Mockjs 源代码实在太过久远，本人用了一个月时间将 Mockjs 的大部分模块进行细分与简化，使用 rollup 打包，使用浏览器端打包测试器进行测试，便于广大开发者学习。

与 Mockjs 的异同点

同

1. Mockjs-esm 沿袭 Mockjs 的大部分 API，常用的 API 测试均通过。
2. 从 1.0.0 版本起对 node 版本也支持使用。

异

1. 对源代码中的大部分逻辑进行了修改和优化。
2. 引用 lodash 和 chroma 库对源代码中的随机函数和颜色转换等函数进行简化。（原作者当年是没有依靠任何库的，这一点令我很佩服）
3. 使用了 @faker-js/faker 优化了英文随机生成部分，但是中文随机生成地区的能力不太行，进行了一些针对性的优化。(faker 开源项目的社区接管版本，希望原作者能够好好对待吧），但是打包版本的 @faker-js/faker 使用 cdn 载入（因为太大了）。
4. 源代码打包方式改为 rollup 打包，生成 esm 版本，cjs 版本和 iife 版本。
5. 扩充 Mockjs 的功能，比如提供 timestamp 模板等。
6. 更改随机颜色为从 中国色 中抽取一种颜色。 （中国色 数据来自于 http://zhongguose.com)
7. 删除 XHR 代理时的同步行为，这个行为已经不被浏览器所使用。
8. 使用继承代理的方式而不是覆盖 XHR 请求的方式代理 原生 XHR 行为。
9. 代码通过 eslint 和 prettier 进行风格化管理，加强代码的可读性。

教程

本项目维持与 Mockjs 一致的 API，故原作者的教程是可以实现的。 官方网站：http://mockjs.com/

从 Mockjs 迁移到 Mockjs-esm（暂时没有稳定）

1. Mockjs-esm 删去了 拦截 url 进行返回的功能，因为在浏览器端有 pollyjs 可以进行这样子的功能，不用重复造轮子了。

2. 修改了部分的 随机 API，（输入数组的方式改变了）大部分 API 不会受到影响。

3. 时间格式化： 由于历史原因，原版 mockjs 的时间格式化与常用的时间库的写法不一致。现在统一使用 dayjs 的写法，参考 https://day.js.org/docs/en/parse/string-format。

// 注意，最为主要的区别是 yyyy 被改成 YYYY 符合从年月日顶层到底层的逻辑
console.log(Random.datetime('YYYY-MM-DD A HH:mm:ss')); // 2021-11-01 AM 06:41:26

npm 安装

npm install @mockjs/core

esm 即用 import 导入

import Mock from '@mockjs/core';
import Mock from 'https://cdn.jsdelivr.net/npm/@mockjs/core/dist/mock.js';

新的功能

1. 生成 timestamp

Mock.mock('@timestamp'); // 生成数字型的 timestamp

接下来的更新

• 添加 Mocha 测试代码
• 添加随机 kaomoji
• 添加随机 emoji
• 联合 @faker-js/faker 的随机库，使得 mockjs 可以直接使用
• 添加随机代码生成（在项目中偶然需要 示例代码 mock）
• 扩展随机图片为随机插图（有很多关于随机图片的 API 网站，他们的图片美观度很高）
• 添加随机视频 URL
• 添加随机音频 URL

作者的闲聊

Mockjs 无疑是一个非常优秀的开源库，这个开源库在模块化思想还没有开始流行，运用类似 jQuery 的编程结构完成了对 Mockjs 的编写，作者的功底很深厚，几乎每个代码文件都有 500 多行，大量运用函数重载，但是整个 Mockjs 的 bug 出奇的少，足见其对于整个项目的理解。

我想要对 Mockjs 进行修改的原因是我的前端爬虫项目需要一个前端的 API 后台，而 Mockjs 对 fetch 这个已经流行了很久的新 API 没有进行适配！所以我下定决心将 Mockjs 全部使用 esm 模块化的方式对源代码进行了重写，重写过程中发现了很多不严谨的地方也加以了限制，对于某些底层的繁复的代码使用 lodash 的函数进行了替代。完善后的 Mockjs 是完全可以运行在浏览器端的，而且完整地运行相应地函数。