vue-cli的build的文件夹下没有dev-server.js文件配置mock数据的方法


Posted in Javascript onApril 17, 2019

由于最新版本的vue-cli已经放弃dev-server.js,需在webpack.dev.conf.js配置才行

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

const express require('express')
const app =express()
var appData = require('..data.json')
var seller = appData.seller
var goods = appData.goods
var ratings = appData.ratings
var apiRoutes = express.Router()
app.use('/api', apiRoutes)

找到devServer后,在最后面添加:

before(app) {
   app.get('/api/appData',function(req,res){
    res.json({
     errno:0,
     data:appData
    })
   }),
   app.get('/api/seller',function(req,res){
    res.json({
     errno:0,
     data:seller
    })
   }),
   app.get('/api/goods',function(req,res){
    res.json({
     errno:0,
     data:goods
    })
   }),
   app.get('/api/ratings',function(req,res){
    res.json({
     errno:0,
     data:ratings
    })
   })
  }

最后一定要重启才会生效,因为修改了配置文件,重新跑一次npm run dev.

打开路径 http://localhost :8080/api/appData就能请求到数据

打开 http://localhost :8080/api/seller 能请求到seller相关数据

如图:

vue-cli的build的文件夹下没有dev-server.js文件配置mock数据的方法

总结

以上所述是小编给大家介绍的vue-cli的build的文件夹下没有dev-server.js文件配置mock数据的方法,希望对大家有所帮助,如果大家有任何疑问请给我留言,小编会及时回复大家的。在此也非常感谢大家对三水点靠木网站的支持!
如果你觉得本文对你有帮助,欢迎转载,烦请注明出处,谢谢!

Javascript 相关文章推荐
onpropertypchange
Jul 01 Javascript
js 函数的副作用分析
Aug 23 Javascript
jQuery语法总结和注意事项小结
Nov 11 Javascript
jquery 实现窗口的最大化不论什么情况
Sep 03 Javascript
jQueryUI 拖放排序遇到滚动条时有可能无法执行排序的小bug及解决方案
Dec 19 Javascript
理解javascript中的Function.prototype.bind的方法
Feb 03 Javascript
详解vue父子模版嵌套案例
Mar 04 Javascript
基于vue实现swipe分页组件实例
May 25 Javascript
HTML5+JS+JQuery+ECharts实现异步加载问题
Dec 16 jQuery
Bootstrap实现的表格合并单元格示例
Feb 06 Javascript
Angular 向组件传递模板的两种方法
Feb 23 Javascript
js使用cookie实现记住用户名功能示例
Jun 13 Javascript
vue component 中引入less文件报错 Module build failed
Apr 17 #Javascript
Vue项目路由刷新的实现代码
Apr 17 #Javascript
vue cli 3.x 项目部署到 github pages的方法
Apr 17 #Javascript
详解vue开发中调用微信jssdk的问题
Apr 16 #Javascript
怎样使你的 JavaScript 代码简单易读(推荐)
Apr 16 #Javascript
vue微信分享的实现(在当前页面分享其他页面)
Apr 16 #Javascript
在Vue项目中使用snapshot测试的具体使用
Apr 16 #Javascript
You might like
PHP防注入安全代码
2008/04/09 PHP
php include和require的区别深入解析
2013/06/17 PHP
PHP入门教程之上传文件实例详解
2016/09/11 PHP
php及codeigniter使用session-cookie的方法(详解)
2017/04/06 PHP
Laravel下生成验证码的类
2017/11/15 PHP
php实现记事本案例
2020/10/20 PHP
jQuery 顺便学习下CSS选择器 奇偶匹配nth-child(even)
2010/05/24 Javascript
jquery dialog键盘事件代码
2010/08/01 Javascript
JQuery魔力之$("tagName")与selector
2012/03/05 Javascript
window.navigate 与 window.location.href 的使用区别介绍
2013/09/21 Javascript
Javascript基础教程之break和continue语句
2015/01/18 Javascript
NPM 安装cordova时警告:npm WARN deprecated minimatch@2.0.10: Please update to minimatch 3.0.2 or higher to
2016/12/20 Javascript
详解能在多种前端框架下使用的表格控件
2017/01/11 Javascript
javascript中mouseenter与mouseover的异同
2017/06/06 Javascript
小程序tab页无法传递参数的方法
2018/08/03 Javascript
详解React项目中碰到的IE问题
2019/03/14 Javascript
15分钟学会vue项目改造成SSR(小白教程)
2019/12/17 Javascript
JavaScript ES6 Class类实现原理详解
2020/05/08 Javascript
Python中使用strip()方法删除字符串中空格的教程
2015/05/20 Python
python实现数组插入新元素的方法
2015/05/22 Python
Python进阶之尾递归的用法实例
2018/01/31 Python
Python及Django框架生成二维码的方法分析
2018/01/31 Python
django之静态文件 django 2.0 在网页中显示图片的例子
2019/07/28 Python
Django使用Channels实现WebSocket的方法
2019/07/28 Python
Python如何用filter函数筛选数据
2020/03/05 Python
Python3 Tensorlfow:增加或者减小矩阵维度的实现
2020/05/22 Python
解决tensorflow读取本地MNITS_data失败的原因
2020/06/22 Python
威盛公司软件C++工程师笔试题面试题
2012/07/16 面试题
《会变的花树叶》教学反思
2014/02/10 职场文书
2014乡镇“三八”国际劳动妇女节活动总结
2014/03/01 职场文书
销售口号大全
2014/06/11 职场文书
重阳节活动主持词
2015/07/04 职场文书
生日宴会家属答谢词
2015/09/29 职场文书
vue-cli4.5.x快速搭建项目
2021/05/30 Vue.js
Java Dubbo框架知识点梳理
2021/06/26 Java/Android
tomcat下部署jenkins的方法
2022/05/06 Servers