最新的vue-webpack-template 中已经去掉了dev-server.js 但是要进行模拟后台数据的,如何模拟本地数据操作? 
解决方法: 
dev-server.js 改用webpack-dev-conf.js代替。

新版webpack.dev.conf.js配置如下:

const portfinder = require(‘portfinder’)后面添加

const express = require('express')
const app = express()
var goodsData = require('../mock/goods.json')//加载本地数据文件
var apiRoutes = express.Router()
app.use('/goods', apiRoutes)
//然后找到devServer,在里面添加

 before(app) {
app.get('/api/goodsData', (req, res) => {
res.json({
errno: 0,
data: goodsData
})//接口返回json数据,上面配置的数据goodsData就赋值给data请求后调用
})
}

然后npm run dev,一定要重启 一下就可以http://localhost:8080/XXX 访问了

截图如下

vue-cli项目配置mock数据(新版本)的更多相关文章

  1. 改造@vue/cli项目为服务端渲染-ServerSideRender

    VUE SEO方案二 - SSR服务端渲染 在上一章中,我们分享了预渲染的方案来解决SEO问题,个人还是很中意此方案的,既简单又能解决大部分问题.但是也有着一定的缺陷,所以我们继续来看下一个方案--服 ...

  2. VUE前端项目配置代理解决跨域问题

    VUE前端项目配置代理解决跨域问题 问题如下,经常在本地调试接口出现这种问题 解决方式1:Chrome 的扩展插件 以前使用Chrome 的扩展插件,但是有时候还是会出现莫名其妙的问题. 需要梯子才行 ...

  3. Vue CLI 3.0脚手架如何在本地配置mock数据

    前后端分离的开发模式已经是目前前端的主流模式,至于为什么会前后端分离的开发我们就不做过多的阐述,既然是前后端分离的模式开发肯定是离不开前端的数据模拟阶段. 我们在开发的过程中,由于后台接口的没有完成或 ...

  4. vue项目配置Mock.js

    扯在前面 最近一直在忙跳槽的事情,博客也好久没有更新了,上次更新还是去年,不出意外的话,从今天起继续今年的博客之旅. 今天继续完善我之前的项目架构,从零开始搭建vue移动端项目到上线,有需要的同学可以 ...

  5. vue-cli项目使用mock数据的方法(借助express)

    前言 现如今前后端分离开发越来越普遍,前端人员写好页面后可以自己模拟一些数据进行代码测试,这样就不必等后端接口,提高了我们开发效率.今天就来分析下前端常用的mock数据的方式是如何实现的. 主体 项目 ...

  6. Vue + webpack 项目配置化、接口请求统一管理

    准备工作 需求由来: 当项目越来越大的时候提高项目运行编译速度.压缩代码体积.项目维护.bug修复......等等成为不得不考虑而且不得不做的问题.  又或者后面其他同事接手你的模块,或者改你的bug ...

  7. 【vue】本地开发mock数据支持

    项目离不开数据渲染的支持,为本地开发配置 数据  支持. (一)方式一:安装JSON Server搭建mock数据的服务器 json Server 是一个创建 伪RESTful服务器的工具. 配置流程 ...

  8. Vue CLI 3 配置兼容IE10

    最近做了一个基于Vue的项目,需要兼容IE浏览器,目前实现了打包后可以在IE10以上运行,但是还不支持在运行时兼容IE10及以上. 安装依赖 yarn add --dev @babel/polyfil ...

  9. vue cli3 项目配置

    [转]https://juejin.im/post/5c63afd56fb9a049b41cf5f4 基于vue-cli3.0快速构建vue项目 本章详细介绍使用vue-cli3.0来搭建项目. 本章 ...

随机推荐

  1. VS2010/MFC编程入门之七(对话框:为对话框添加控件)

    创建对话框资源需要创建对话框模板.修改对话框属性.为对话框添加各种控件等步骤,前面一讲中鸡啄米已经讲了创建对话框模板和修改对话框属性,本节继续讲如何为对话框添加控件. 上一讲中鸡啄米创建了一个名为“A ...

  2. 2016-2017 ACM-ICPC CHINA-Final Solution

    Problem A. Number Theory Problem Solved. 水. #include<bits/stdc++.h> using namespace std; ; typ ...

  3. react headtop title 截取

    render() { const nav = this.props.nav const text = nav && nav.length > 5 ? this.strHandle ...

  4. Python 3 并发编程多进程之进程池与回调函数

    Python 3 进程池与回调函数 一.进程池 在利用Python进行系统管理的时候,特别是同时操作多个文件目录,或者远程控制多台主机,并行操作可以节约大量的时间.多进程是实现并发的手段之一,需要注意 ...

  5. PHP多进程学习(一)__来初步了解一下PHP多进程及简单demo

    php是一门单进程弱类型的语言,PHP处理多并发主要是依赖服务器或PHP-FPM的多进程及它们进程的复用,多进程的作用优点大家可以去网上了解,PHP实现多进程在实际项目中意义也是不容小觑的.比如:日常 ...

  6. bzoj1618 / P2918 [USACO08NOV]买干草Buying Hay(完全背包)

    P2918 [USACO08NOV]买干草Buying Hay 显然的完全背包 设$f[i]$为买$i$磅干草的最小代价 搞搞完全背包即可 注意到最后可能买的干草超出范围,但是价格可能更低. 于是我们 ...

  7. Python3:Requests模块的异常值处理

    Python3:Requests模块的异常值处理 用Python的requests模块进行爬虫时,一个简单高效的模块就是requests模块,利用get()或者post()函数,发送请求. 但是在真正 ...

  8. 基于OpenCV进行图像拼接原理解析和编码实现(提纲 代码和具体内容在课件中)

    一.背景 1.1概念定义 我们这里想要实现的图像拼接,既不是如题图1和2这样的"图片艺术拼接",也不是如图3这样的"显示拼接",而是实现类似"BaiD ...

  9. FromBottomToTop第十二周项目博客

    FromBottomToTop第十二周项目博客 本周项目计划 设计整体架构,收集素材,制作出静态界面部分 项目进展 已完成游戏整体架构设计 已完成游戏界面.背景音乐等素材的收集 正在进行静态界面部分的 ...

  10. double、float等多字节数据处理

    一.常规的多字节: 有2,4,8字节 float和double是具有自身算法的数据类型,和其他整型不一样[整型数据,可以直接通过移位来进行计算值的大小,float和double不行] 值 = 尾数x ...