目录

前端工具-json-server

介绍

react18 + vite项目为例,介绍前端mock数据的方式;

1:安装

bash 复制代码
npm i json-server -D

2、项目根目录下创建mock数据文件

server/data.json

json 复制代码
{
  "login": {
    "userName": "张三",
    "userId": 666,
    "token": "123456"
  },
  "logout": {
    "message": "退出成功"
  },
  "userList": [
    {
      "id": 1,
      "name": "张三",
      "age": 18,
      "gender": "男",
      "address": "北京市"
    }
  ]
}

3、配置启动脚本

json 复制代码
// package.json
  "scripts": {
    "serve": " json-server --watch server/data.json --port 3000"
  }

4、启动mock服务

bash 复制代码
npm run serve
本文是转载文章,点击查看原文
如有侵权,请联系 xyy@jishuzhan.net 删除
相关推荐
萌萌哒草头将军5 小时前
⚡⚡⚡尤雨溪宣布开发 Vite Devtools,这两个很哇塞 🚀 Vite 的插件,你一定要知道!
前端·vue.js·vite
小彭努力中5 小时前
7.Three.js 中 CubeCamera详解与实战示例
开发语言·前端·javascript·vue.js·ecmascript
浪裡遊6 小时前
跨域问题(Cross-Origin Problem)
linux·前端·vue.js·后端·https·sprint
LinDaiuuj6 小时前
判断符号??,?. ,! ,!! ,|| ,&&,?: 意思以及举例
开发语言·前端·javascript
Java Fans6 小时前
WPF使用SQLite与JSON文本文件结合存储体侧平衡数据的设计与实现
sqlite·json·wpf
敲厉害的燕宝6 小时前
Pinia——Vue的Store状态管理库
前端·javascript·vue.js
Aphasia3117 小时前
react必备JavaScript知识点(二)——类
前端·javascript
玖玖passion7 小时前
数组转树:数据结构中的经典问题
前端
呼Lu噜7 小时前
WPF-遵循MVVM框架创建图表的显示【保姆级】
前端·后端·wpf
珠峰下的沙砾7 小时前
Vue3 里 CSS 深度作用选择器 :global
前端·javascript·css