json-server的使用(根据json数据一键生成接口)

一.使用目的

在前端开发初期,后端 API 可能还未完成,json-server 可以快速创建模拟的 RESTful API,帮助前端开发者进行开发和测试。

二.安装

复制代码
npm install json-server //局部安装


npm i json-server -g   //全局安装

三.使用教程

1.准备一个json格式的文件

这里是让ai生成的一段,用来演示,使用是根据你的情况具体改。

复制代码
{
  "users": [
  {
    "id": 1,
    "name": "张三",
    "email": "zhangsan@example.com",
    "age": 28
  },
  {
    "id": 2,
    "name": "李四",
    "email": "lisi@example.com",
    "age": 25
  },
  {
    "id": 3,
    "name": "王五",
    "email": "wangwu@example.com",
    "age": 32
  }
]
}

2.进入该json文件的存储目录,右键,点击从终端中打开。

输入json-server --watch json文件的名字(按tab可以快速找到目标文件),然后按下回车

接口展示

即可看到接口已经生成了,可以帮助前端开发者进行调试。

详细使用请看官方文档 : https://www.npmjs.com/package/json-server

相关推荐
庖丁AI20 小时前
PDF 表格提取到 CSV 和 JSON 怎么做?复杂版式要先解决结构化解析
pdf·json
CedarQR2 天前
VS Code Copilot Chat 配置 MCP Server 全攻略(以 Next AI Draw.io 为例)
人工智能·ui·json
肖志-AI全栈2 天前
从零讲透 Ajax:XHR、Fetch、JSON 序列化到异步编程全链路
前端·ajax·json
前端Baymax2 天前
JSON配置文件的UTF-8 BOM编码陷阱
json
东方-教育技术博主4 天前
论文全文翻译_通过VR课堂适应性反馈提升职前教师注意能力
json·vr
Random_index5 天前
#Vue3篇: Vue 项目发版后如何提示用户刷新?基于 package.json 版本号的前端更新检测方案
前端·vue.js·json
寻道模式5 天前
【开发心得】GA + 飞书频繁报错被忽略的“元凶”
json·飞书·ga
SelectDB技术团队5 天前
Agent 场景动态 JSON 性能拆解:Apache Doris 比 ClickHouse 快 7 倍、比 Elasticsearch 快 2 倍
数据库·clickhouse·elasticsearch·json·apache·日志分析·apache doris
Dontla5 天前
Claude Code如何管理自动执行的命令?(/permissions命令、settings.json、settings.local.json、命令权限)
json
Amy187021118236 天前
UL证书只是起点——智能电表出口北美,真正的考验在量产之后
json