JSON-server的使用

最新推荐文章于 2025-03-29 11:24:38 发布

灯光下的投影

最新推荐文章于 2025-03-29 11:24:38 发布

阅读量752

点赞数 1

分类专栏： vue 文章标签： json-server 模拟数据

本文链接：https://blog.csdn.net/liuyuhua666/article/details/92837530

版权

在前后端并行开发中，前端往往需要模拟数据接口以进行开发。本文重点介绍了JSON-server这一命令行工具，包括如何安装（npm i json-server -g）、运行（json-server json数据文件相对路径）及生成的默认URL（如http://localhost:3000/students和http://localhost:8080/teachers）。此外，还提及了live-server和http-server在本地建立服务以访问资源的场景及其使用方法。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

因为前后端是并行开发的，前端在开发过程当中用到的接口得等后端出来之后才能提供，但是这样的话，前端的开发进度就会收到影响,前端人员需要自己模拟数据接口

1. json-server

2. mock.js

3. fiddler

本文介绍的是json-server

JSON-server是一个命令行工具：

1. 安装

npm i json-server -g

2. 直接运行即可

先创建一个含有json数据的json文件

在命令行中输入：json-server json数据文件相对路径

json文件(students.json)：

{
  "students": [
    {
      "name": "aa",
      "id": 1
    },
    {
      "name": "bb",
      "id": 2
    },
    {
      "name": "cc",
      "id": 3
    }
  ],
  "teachers": []
}

运行json-server data/students.json后

生成两个url：

http://localhost:3000/students

http://localhost:8080/teachers

使用：