ez-mock 是一个简单易用的 Node.js 模拟数据工具,可以帮助前端开发者快速创建本地 Mock 数据。
安装
要使用 ez-mock,需要先安装 Node.js,然后使用 npm 或者 yarn 安装 ez-mock:
npm install ez-mock --save-dev
yarn add ez-mock --dev
使用
安装完成后,在项目根目录下创建一个 mock
目录,然后在该目录下创建一个 index.js
文件,用来编写 Mock 数据。
示例 index.js
文件:
-- -------------------- ---- ------- ----- -------- - - ------------ - ----- ----- ---- -- -- ------------ - - --- -- ----- ------ ----- -------- -- - --- -- ----- ------ ----- -------- -- - --- -- ----- ------ ----- -------- -- -- -- -------------- - - ------------ --
创建完成后,在 package.json
文件中新增以下代码,用于启动 ez-mock:
{ "scripts": { "mock": "ez-mock ./mock" } }
在终端中执行 npm run mock
或者 yarn mock
命令即可启动 ez-mock。
启动成功后,可以在浏览器中访问 http://localhost:3000/api/user
和 http://localhost:3000/api/menu
,即可看到对应的 Mock 数据。
功能介绍
编写 Mock 数据
在 mock/index.js
文件中,可以使用 JavaScript 对象、数组或者函数来表示 Mock 数据。
JavaScript 对象和数组的书写方式和普通 JavaScript 对象和数组一致。
函数接收两个参数:req
和 res
,分别表示请求对象和响应对象,可以通过这两个参数动态生成 Mock 数据。例如:
-- -------------------- ---- ------- ----- -------- - - ------------- ----- ---- -- - ----- - --------- -------- - - --------- -- --------- --- ------- -- -------- --- --------- - ------ - ----- ---- -------- ------- ------ -------- -- - ---- - ---------------- ------ - ----- ---- -------- ----------- -- - -- -- -------------- - - ------------ --
自定义请求方法和路由前缀
默认情况下,ez-mock 会自动处理 GET、POST、PUT、DELETE 等 HTTP 请求方法和路由前缀为 /api
的请求。如果需要自定义请求方法和路由前缀,可以在 package.json
文件中进行配置,例如:
{ "ezMock": { "prefix": "/api/v1", "methods": ["GET", "POST", "PUT"] } }
自定义响应时间和状态码
默认情况下,ez-mock 会自动设置响应时间为 500ms,状态码为 200。如果需要自定义响应时间和状态码,可以在 Mock 数据中进行配置,例如:
-- -------------------- ---- ------- ----- -------- - - ------------ - ----- ----- ---- --- ------ ----- -- -- ------ --- ----------- ---- -- ---- --- -- -- -------------- - - ------------ --
Mock 数据模板
在 Mock 数据中,可以使用 Mock.js 提供的模板语法,生成符合规范的 Mock 数据。例如:
-- -------------------- ---- ------- ----- ---- - ------------------ ----- -------- - - ------------ - ----- ---------------------- -- ---------- ---- ----------------------- ------ -- ------ -- - -- --- -- -- -------------- - - ------------ --
总结
通过本文学习,你已经了解了 npm 包 ez-mock 的基本使用方法和功能。ez-mock 简单易用,可以帮助前端开发者快速创建本地 Mock 数据,提高开发效率,降低开发成本。当然,ez-mock 还有很多高级功能和用法,欢迎进一步探索。
来源:JavaScript中文网 ,转载请注明来源 https://www.javascriptcn.com/post/6005678a81e8991b448e3eaa