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的更多相关文章

  1. VUE,基于vue-cli搭建创建vue项目

    前提:必须安装node.js,官方地址:https://nodejs.org/en/ 然后安装vue-cli 安装方式:cmd命令行安装:打开cmd命令符输入进行全局安装脚手架:npm install ...

  2. Vue2+Webpack创建vue项目

    相比较AngularJS和ReactJS,VueJS一直以轻量级,易上手称道.MVVM的开发模式也使前端从原先的DOM中解放出来,我们在不需要在维护视图和数据的统一上花大量时间,只需要关注于data的 ...

  3. day66_10_10,vue项目环境搭建

    一.下载. 首先去官网查看网址. 下载vue环境之前需要先下载node,使用应用商城npm下载,可以将其下载源改成cnpm: """ node ~~ python:nod ...

  4. Vue 项目环境搭建

    Vue项目环境搭建 ''' 1) 安装node 官网下载安装包,傻瓜式安装:https://nodejs.org/zh-cn/ 2) 换源安装cnpm >: npm install -g cnp ...

  5. 如何创建vue项目

    Vue项目环境搭建 """ node ~~ python:node是用c++编写用来运行js代码的 npm(cnpm) ~~ pip:npm是一个终端应用商城,可以换国内 ...

  6. vue项目环境搭建与组件介绍

    Vue项目环境搭建 """ node ~~ python:node是用c++编写用来运行js代码的 npm(cnpm) ~~ pip:npm是一个终端应用商城,可以换国内 ...

  7. 《Asp.Net Core3 + Vue3入坑教程》 - Vue 1.使用vue-cli创建vue项目

    简介 <Asp.Net Core3 + Vue3入坑教程> 此教程适合新手入门或者前后端分离尝试者.可以根据图文一步一步进操作编码也可以选择直接查看源码.每一篇文章都有对应的源码 目录 & ...

  8. 使用cnpm创建vue项目(含离线安装)

    # 全局安装淘宝cnpm npm install -g cnpm --registry=https://registry.npm.taobao.org #升级 npm cnpm install npm ...

  9. 使用vue-cli创建vue项目

    vue-cli是官方发布的vue.js项目脚手架工具,使用它可以快速创建vue项目,github地址:https://github.com/vuejs/vue-cli 1.安装vue-cli //设置 ...

  10. 通过脚手架创建Vue项目

    第一步 准备工作 1.下载安装Node.js 验证是否安装的方法,在命令行输入node -v 2.安装Vue 在命令行输入npm install -g @vue/cli 查看Vue版本号 npm vu ...

随机推荐

  1. harbor 搭建和部署

    Docker官方的Docker Registry镜像,可以用来储存和分发Docker镜像.不过实在不昨的,仅仅能储存和分发镜像,也不提供UI,你还得自己找一个过时的UI搭建,受限制于Docker Re ...

  2. 一文了解io包中的discard类型

    1. 引言 io.discard是Go语言标准库提供一个结构体类型,其在丢弃不需要的数据场景下非常好用.本文我们将从io.discard 类型的基本定义出发,讲述其基本使用和实现原理,接着简单描述 i ...

  3. Java架构师之路:从Java码农到年薪八十万,最牛Java架构师进阶路线

    Java架构师之路:从Java码农到年薪八十万,最牛Java架构师进阶路线 摘要:本文将为Java开发工程师提供一条从Java码农到年薪八十万的进阶之路,探讨如何成为一名顶尖的Java架构师.我们将介 ...

  4. protolator - Protobuf <==> json

    github.com/hyperledger/fabric-config/protolator 是 Hyperledger Fabric 中的一个 Go 包,用于将 Protocol Buffers( ...

  5. (转)[Android测试] Android Studio+Appium+Java+Windows 自动化测试之二:Appium环境安装搭建

    一.需要下载安装的东西 1. 文件下载 网上也有挺多安装教程的,这里我提供我的安装方法.Win10 64位.一些文件我在后面打包. 2016.9.12号本人安装记录. SDK: 由于我是搞Androi ...

  6. CAJViewer卡的解决办法

    在做毕业设计时,使用了CAJViewer7.2版本的阅读器,使用起来非常卡,翻页总是不流畅,体验感极差. 最后实在受不了了,去百度了一下,在贴吧中看到了疑似解决方案,尝试了一下,真的不卡了.所以特此写 ...

  7. 在centos7.X下安装Java

    发布于 2 分钟前  2 次阅读 1.创建JDK目录 mkdir /opt/jdk 2.通过finalshell或xftp将jdk上传到/opt/jdk目录中 3.cd /opt/jdk 4.解压jd ...

  8. Flutter系列文章-Flutter 插件开发

    在本篇文章中,我们将学习如何开发 Flutter 插件,实现 Flutter 与原生平台的交互.我们将详细介绍插件的开发过程,包括如何创建插件项目.实现方法通信.处理异步任务等.最后,我们还将演示如何 ...

  9. 《小白WEB安全入门》02. 开发篇

    @ 目录 初识HTML潜在漏洞 初识CSS潜在漏洞 初识JS潜在漏洞 初识后端潜在漏洞 后端能做什么 后端种类 后端框架 潜在漏洞 本系列文章只叙述一些超级基础理论知识,极少有实践部分 本文涉及到的语 ...

  10. 了解 HarmonyOS

    引言 在开始 HarmonyOS 开发之前,了解其背景.特点和架构是非常重要的.本章将为你提供一个全面的 HarmonyOS 概览. 目录 什么是 HarmonyOS HarmonyOS 的发展历程 ...