创建vue项目并搭建JSONSERVER
1、该前提是你已经搭建好vue-cli脚手架,开始创建一个新项目,输入 vue init webpack demo(demo是自定义项目名)。
2、cd demo 进入项目安装依赖
3、在已经创建的项目结构里面会多出一个node_modules的文件夹,这就是刚才安装的所有依赖
4、此时项目构建完成,输入npm run dev运行项目

5、搭建jsonserver(先下载 https://github.com/typicode/json-server)
6、Json server 安装命令:
cnpm install -g json-server
7、查看结果 json-server -v
结果如图即安装完成
8、启动jsonserver : json-server --watch db.json

登录localhost:3000

9、测试自己的数据,可以打开db.json修改



10、可以修改package.json的启动方式

11、启动: npm run json:server

创建vue项目并搭建JSONSERVER的更多相关文章
- VUE,基于vue-cli搭建创建vue项目
前提:必须安装node.js,官方地址:https://nodejs.org/en/ 然后安装vue-cli 安装方式:cmd命令行安装:打开cmd命令符输入进行全局安装脚手架:npm install ...
- Vue2+Webpack创建vue项目
相比较AngularJS和ReactJS,VueJS一直以轻量级,易上手称道.MVVM的开发模式也使前端从原先的DOM中解放出来,我们在不需要在维护视图和数据的统一上花大量时间,只需要关注于data的 ...
- day66_10_10,vue项目环境搭建
一.下载. 首先去官网查看网址. 下载vue环境之前需要先下载node,使用应用商城npm下载,可以将其下载源改成cnpm: """ node ~~ python:nod ...
- Vue 项目环境搭建
Vue项目环境搭建 ''' 1) 安装node 官网下载安装包,傻瓜式安装:https://nodejs.org/zh-cn/ 2) 换源安装cnpm >: npm install -g cnp ...
- 如何创建vue项目
Vue项目环境搭建 """ node ~~ python:node是用c++编写用来运行js代码的 npm(cnpm) ~~ pip:npm是一个终端应用商城,可以换国内 ...
- vue项目环境搭建与组件介绍
Vue项目环境搭建 """ node ~~ python:node是用c++编写用来运行js代码的 npm(cnpm) ~~ pip:npm是一个终端应用商城,可以换国内 ...
- 《Asp.Net Core3 + Vue3入坑教程》 - Vue 1.使用vue-cli创建vue项目
简介 <Asp.Net Core3 + Vue3入坑教程> 此教程适合新手入门或者前后端分离尝试者.可以根据图文一步一步进操作编码也可以选择直接查看源码.每一篇文章都有对应的源码 目录 & ...
- 使用cnpm创建vue项目(含离线安装)
# 全局安装淘宝cnpm npm install -g cnpm --registry=https://registry.npm.taobao.org #升级 npm cnpm install npm ...
- 使用vue-cli创建vue项目
vue-cli是官方发布的vue.js项目脚手架工具,使用它可以快速创建vue项目,github地址:https://github.com/vuejs/vue-cli 1.安装vue-cli //设置 ...
- 通过脚手架创建Vue项目
第一步 准备工作 1.下载安装Node.js 验证是否安装的方法,在命令行输入node -v 2.安装Vue 在命令行输入npm install -g @vue/cli 查看Vue版本号 npm vu ...
随机推荐
- JS逆向实战19——通杀webpack逆向
声明 本文章中所有内容仅供学习交流,抓包内容.敏感网址.数据接口均已做脱敏处理,严禁用于商业用途和非法用途,否则由此产生的一切后果均与作者无关,若有侵权,请联系我立即删除! 网站 aHR0cHM6Ly ...
- BeanDefinitionStoreException: Failed to read candidate component class
ssm 整合时出现问题 org.springframework.beans.factory.BeanDefinitionStoreException: Failed to read candidate ...
- 现代C++(Modern C++)基本用法实践:三、移动语义
概述 移动 移动(move)语义C++引入了一种新的内存优化,以避免不必要的拷贝.在构造或者赋值的时候,如果实参是右值(或者左值由std::move转换成右值),便会匹配移动语义的函数调用如下述举例的 ...
- 用 Golang 从0到1实现一个高性能的 Worker Pool(一) - 每天5分钟玩转 GPT 编程系列(3)
目录 1. 概述 2. 设计 2.1 让 GPT-4 给出功能点 2.2 自己总结需求,再给 GPT 派活 3. 实现 3.1 你先随意发挥 3.2 你得让 Worker 跑起来呀 3.3 你说说 P ...
- QPushButton中常用的方法
常用方法如下所示: setCheckable():设置按钮是否已经被选中,如果设置为True,则表示按钮将保持已点击和释放状态. toggl():在按钮之间进行切换 setIcon():设置按钮上的图 ...
- SpringBoot3基础用法
目录 一.背景 二.环境搭建 1.工程结构 2.框架依赖 3.环境配置 三.入门案例 1.测试接口 2.全局异常 3.日志打印 3.1 日志配置 3.2 日志打印 四.打包运行 五.参考源码 技术和工 ...
- Nginx快速入门:简介、安装、配置
Nginx概述 与 Apache 软件类似,Nginx ("engine x")是一个开源的.支持高性能.高并发的web服务和代理服务软件.它是由俄罗斯人 Igor Sysoev ...
- 创建python虚拟环境并打包python文件
前言 当需要为一个离线环境部署python应用时,离线环境可能缺少各种python环境,有docker的话可以用docker,没有docker可以用pyinstaller打包成二进制文件.pyinst ...
- idea的maven home默认路径无法修改成功的问题
主要原因是项目里有许多初始默认文件 删除项目初始化后的生成的.mvn mvnw mvnw.cmd help.md .gitignore等文件后再修改mavenhome,然后reload maven就修 ...
- 论文解读(ECACL)《ECACL: A Holistic Framework for Semi-Supervised Domain Adaptation》
Note:[ wechat:Y466551 | 付费咨询,非诚勿扰 ] 论文信息 论文标题:ECACL: A Holistic Framework for Semi-Supervised Domain ...