在const portfinder = require('portfinder')后面添加

const express = require('express')

const app = express()

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

在当前js搜索devServer,在里面添加

devServer: {
before(app) {
app.get('/api/seller', (req, res) => {
res.json({
// 这里是你的json内容
errno: 0,
data: seller
})
}),
app.get('/api/goods', (req, res) => {
res.json({
// 这里是你的json内容
errno: 0,
data: goods
})
}),
app.get('/api/ratings', (req, res) => {
res.json({
// 这里是你的json内容
errno: 0,
data: ratings
})
})
}, },

然后fetch请求

  mounted(){
fetch('./api/seller').then((res)=>{
return res.json()
}).then((stroies)=>{
console.log(stroies)
})
}

vue -webpack.dev.config.js模拟后台数据接口的更多相关文章

  1. 解决运行webpack --config webpack.dev.config.js 报错ReferenceError: _dirname is not defined

    控制台报错信息如下 将webpack.dev.config.js中的_dirname 改为 __dirname 注意这里是两个下划线谢谢!感觉好坑

  2. vue - webpack.dev.conf.js

    描述:开发时的配置.(配置开发时的一些操作) 例如这里,是否自动打开浏览器(默认true) 'use strict' // build/util.js const utils = require('. ...

  3. Mock模拟后台数据接口--再也不用等后端的API啦

    ok,在开发中经常需要从后台获取数据,那么有时候后台的数据接口并没有写好,所以这时候,就需要自己模拟数据接口,来实现前端逻辑, 今天数的就是阿里巴巴的一款mock产品,很好用的哦!!!! ok!这是我 ...

  4. vue - webpack.dev.conf.js for merge

    webpack-merge提供了一个merge连接数组并合并创建新对象的对象的函数.如果遇到函数,它将执行它们,通过算法运行结果,然后再次将返回的值包装在函数中. 这种行为在配置webpack时特别有 ...

  5. vue - webpack.dev.conf.js for CopyWebpackPlugin

    描述:将单个文件或整个目录复制到构建目录 官网地址:https://www.npmjs.com/package/copy-webpack-plugin // 复制到自定义静态源 new CopyWeb ...

  6. vue - webpack.dev.conf.js for FriendlyErrorsPlugin

    描述:webpack网页端友好的报错信息就来自它 官网:https://www.npmjs.com/package/friendly-errors-webpack-plugin new Friendl ...

  7. vue - webpack.dev.conf.js for HtmlWebpackPlugin

    描述: 这是一个webpack插件,可以简化HTML文件的创建,为您的webpack捆绑服务提供服务. 这对于webpack包含文件名中包含哈希值的bundle 来说尤其有用,它会更改每个编译. 您可 ...

  8. vue - webpack.dev.conf.js for node-portfinder

    描述:获取当前可用的port. (vue-cli配置好了,一旦端口被占用,报错,再次运行时会打开:8080+1,依次类推...8080+n) 官网地址:https://www.npmjs.com/pa ...

  9. vue模拟后台数据,请求本地数据的配置(旧版本dev-server.js,新版本webpack.dev.conf.js)

    最近学习一个vue-cli的项目,需要与后台进行数据交互,这里使用本地json数据来模仿后台数据交互流程.然而发现build文件夹下没有dev-server.js文件了,因为新版本的vue-webpa ...

随机推荐

  1. GIT好文搜藏

    git图解:代码区域总结 https://zhuanlan.zhihu.com/p/20175919 git跟传统的代码管理器(如:svn)不同, 主要区别在于git多了个本地仓库以及缓存区,所以即使 ...

  2. [笔记]New in Chrome 66

    原文 CSS Typed Object Model 使用CSS object model,返回的一切都是字符串 el.style.opacity = 0.3; console.log(typeof e ...

  3. Burpsuite之Burp Collaborator模块介绍

    Burp Collaborator.是从Burp suite v1.6.15版本添加的新功能,它几乎是一种全新的渗透测试方法.Burp Collaborator.会渐渐支持blind XSS,SSRF ...

  4. Linux pmap 工具

    pmap 用来查看当前进程占用内存使用详细 pmap 格式: -x, --extended # 显示扩展的信息 -d, --device # 显示设备的信息 -q, --quiet # 不显示头或脚注 ...

  5. Java SE之正则表达式五:切割

    /** * * @author Zen Johnny * @date 2018年4月29日 下午3:53:55 * */ package demo.regex; /* 正则表达式:切割 */ publ ...

  6. 使用electron搭建桌面app的简便方法

    使用electron官方给出的`electron-quick-start`示例项目,将其拷贝下来, 1. git命令:   git clone https://github.com/electron/ ...

  7. Factorized Hidden Variability Learning For Adaptation Of Short Duration Language Identification Models

    基于因子分解的隐层变量学习,应用于短语句语种识别模型的自适应     LFVs(Language Feature Vectors,语种特征向量)[11],与BSVs(Bottleneck Speake ...

  8. 单片机AT和STC区别

    http://www.21ic.com/jichuzhishi/datasheet/AT89C51/data/192017.html

  9. 课程9:《hibernate框架开发2016版视频》视频目录

    \第1天\视频\01_今天内容介绍.avi; \第1天\视频\02_web内容回顾.avi; \第1天\视频\03_hibernate框架概述.avi; \第1天\视频\04_什么是orm思想.avi ...

  10. Out of range value for column ""

    今天同事在初始化数据时,在初始手机号遇到如下报错:  我实体类的字段如下: @Column @Comment("购车人手机号") @ColDefine(type = ColType ...