JsonServer安装及启动过程图解


Posted in Javascript onFebruary 28, 2020

JsonServer

主要的作用就是搭建本地的数据接口,创建json文件,便于调试调用

是一个 Node 模块,运行 Express 服务器,可以指定一个 json 文件作为 api 的数据源

官网:https://www.npmjs.com/package/json-server

安装全局的json-server

终端中输入:npminstall-gjson-server(windows系统)

mac系统:则为 sudonpminstall-gjson-server 如下图:

JsonServer安装及启动过程图解

初始化package.json

终端中进入所要存放文件的目录

执行初始化命令:npm init

JsonServer安装及启动过程图解

给文件包取一个名字,其他的默认 enter 就可以

jsonserver 保存到本地

执行命令:npm install json-server --save

执行后打开 package.json 文件

将 scripts 中内容进行修改:

“json:server” 将最为启动时json-server时使用

db.json将做为启动后作为服务器的数据进行使用

JsonServer安装及启动过程图解

创建db.json 文件

在与package.json 同目录下创建db.json 文件,并以 对象 的格式进行填充数据

JsonServer安装及启动过程图解

运行 json-server

终端中输入:npm run json:server

JsonServer安装及启动过程图解

如上图:home 地址:http://localhost:3000

resources 地址,即创建的db.json中数据所在位置:http://localhost:3000/product

浏览器中运行http://localhost:3000 后:

JsonServer安装及启动过程图解

浏览器中运行http://localhost:3000/product 后结果:

JsonServer安装及启动过程图解

如下图,浏览器中每访问一次,终端则会输出对应的执行

JsonServer安装及启动过程图解

postman 请求该接口

通过postman 请求该 API 发现数据确实来源于服务端

JsonServer安装及启动过程图解

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
Apply an AutoFormat to an Excel Spreadsheet
Jun 12 Javascript
js操作时间(年-月-日 时-分-秒 星期几)
Jun 20 Javascript
Extjs 4.x 得到form CheckBox 复选框的值
May 04 Javascript
node.js中的fs.unlinkSync方法使用说明
Dec 15 Javascript
原生javaScript实现图片延时加载的方法
Dec 22 Javascript
javascript实现数组内值索引随机化及创建随机数组的方法
Aug 10 Javascript
jQuery解析json格式数据简单实例
Jan 22 Javascript
微信小程序 自定义对话框实例详解
Jan 20 Javascript
响应式框架Bootstrap栅格系统的实例
Dec 19 Javascript
select2 ajax 设置默认值,初始值的方法
Aug 09 Javascript
Vue通过for循环随机生成不同的颜色或随机数的实例
Nov 09 Javascript
vue-cli3 引入 font-awesome的操作
Aug 11 Javascript
Vue自定义组件的四种方式示例详解
Feb 28 #Javascript
Vue.js 中制作自定义选择组件的代码附演示demo
Feb 28 #Javascript
使用vue-cli3+typescript的项目模板创建工程的教程
Feb 28 #Javascript
基于vue-cli3+typescript的tsx开发模板搭建过程分享
Feb 28 #Javascript
vue 中的 render 函数作用详解
Feb 28 #Javascript
微信小程序动态添加和删除组件的现实
Feb 28 #Javascript
浅析Vue 中的 render 函数
Feb 28 #Javascript
You might like
Warning: session_destroy() : Trying to destroy uninitialized sessionq错误
2011/06/16 PHP
PHP读取PDF内容配合Xpdf的使用
2012/11/24 PHP
PHP开发中常用的十个代码样例
2016/02/02 PHP
PHP+Ajax实现无刷新分页实例详解(附demo源码下载)
2016/04/07 PHP
自适应高度框架 ----属个人收藏内容
2007/01/22 Javascript
JavaScript delete操作符应用实例
2009/01/13 Javascript
jquery CSS选择器笔记
2010/03/29 Javascript
JQuery中Text方法用法实例分析
2015/05/18 Javascript
JavaScript为事件句柄绑定监听函数实例详解
2015/12/15 Javascript
jQuery基于BootStrap样式实现无限极地区联动
2016/08/26 Javascript
JS中传递参数的几种不同方法比较
2017/01/20 Javascript
jQuery给表格添加分页效果
2017/03/02 Javascript
js实现手机发送验证码功能
2017/03/13 Javascript
使用Node.js实现ORM的一种思路详解(图文)
2017/10/24 Javascript
jQuery Ajax实现Select多级关联动态绑定数据的实例代码
2018/10/26 jQuery
Vue触发隐藏input file的方法实例详解
2019/08/14 Javascript
Node.js HTTP服务器中的文件、图片上传的方法
2019/09/23 Javascript
跟老齐学Python之一个免费的实验室
2014/09/14 Python
在Python中使用HTML模版的教程
2015/04/29 Python
详解Python中 __get__和__getattr__和__getattribute__的区别
2016/06/16 Python
图文详解Django使用Pycharm连接MySQL数据库
2019/08/09 Python
详解Django将秒转换为xx天xx时xx分
2019/09/27 Python
安装2019Pycharm最新版本的教程详解
2019/10/22 Python
简单了解Pandas缺失值处理方法
2019/11/16 Python
python安装cx_Oracle和wxPython的方法
2020/09/14 Python
python re模块常见用法例举
2021/03/01 Python
利用Canvas模仿百度贴吧客户端loading小球的方法示例
2017/08/13 HTML / CSS
Ellesse英国官网:意大利高级运动品牌
2019/07/23 全球购物
俄罗斯在线购买飞机票、火车票、巴士票网站:Tutu.ru
2020/03/16 全球购物
说一下Linux下有关用户和组管理的命令
2014/08/18 面试题
个人查摆剖析材料
2014/02/04 职场文书
幼儿教师师德承诺书
2014/05/23 职场文书
诉讼授权委托书
2014/10/15 职场文书
幼儿园中班教育随笔
2015/08/14 职场文书
《圆的周长》教学反思
2016/02/17 职场文书
Redis遍历所有key的两个命令(KEYS 和 SCAN)
2021/04/12 Redis