vue -webpack.dev.config.js模拟后台数据接口
在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模拟后台数据接口的更多相关文章
- 解决运行webpack --config webpack.dev.config.js 报错ReferenceError: _dirname is not defined
控制台报错信息如下 将webpack.dev.config.js中的_dirname 改为 __dirname 注意这里是两个下划线谢谢!感觉好坑
- vue - webpack.dev.conf.js
描述:开发时的配置.(配置开发时的一些操作) 例如这里,是否自动打开浏览器(默认true) 'use strict' // build/util.js const utils = require('. ...
- Mock模拟后台数据接口--再也不用等后端的API啦
ok,在开发中经常需要从后台获取数据,那么有时候后台的数据接口并没有写好,所以这时候,就需要自己模拟数据接口,来实现前端逻辑, 今天数的就是阿里巴巴的一款mock产品,很好用的哦!!!! ok!这是我 ...
- vue - webpack.dev.conf.js for merge
webpack-merge提供了一个merge连接数组并合并创建新对象的对象的函数.如果遇到函数,它将执行它们,通过算法运行结果,然后再次将返回的值包装在函数中. 这种行为在配置webpack时特别有 ...
- vue - webpack.dev.conf.js for CopyWebpackPlugin
描述:将单个文件或整个目录复制到构建目录 官网地址:https://www.npmjs.com/package/copy-webpack-plugin // 复制到自定义静态源 new CopyWeb ...
- vue - webpack.dev.conf.js for FriendlyErrorsPlugin
描述:webpack网页端友好的报错信息就来自它 官网:https://www.npmjs.com/package/friendly-errors-webpack-plugin new Friendl ...
- vue - webpack.dev.conf.js for HtmlWebpackPlugin
描述: 这是一个webpack插件,可以简化HTML文件的创建,为您的webpack捆绑服务提供服务. 这对于webpack包含文件名中包含哈希值的bundle 来说尤其有用,它会更改每个编译. 您可 ...
- vue - webpack.dev.conf.js for node-portfinder
描述:获取当前可用的port. (vue-cli配置好了,一旦端口被占用,报错,再次运行时会打开:8080+1,依次类推...8080+n) 官网地址:https://www.npmjs.com/pa ...
- vue模拟后台数据,请求本地数据的配置(旧版本dev-server.js,新版本webpack.dev.conf.js)
最近学习一个vue-cli的项目,需要与后台进行数据交互,这里使用本地json数据来模仿后台数据交互流程.然而发现build文件夹下没有dev-server.js文件了,因为新版本的vue-webpa ...
随机推荐
- Hero Patterns - 聚合各种 SVG 背景纹理素材的网站
Hero Patterns 是一个聚合了各种 SVG 背景纹理素材的网站,提供的多样的素材可以给你的网站带去特色. SVG 是一种分辨率无关的图形(矢量图形).这意味着它在任何类型的屏幕都不会遭受任何 ...
- 【游戏开发&Unity】捏脸系统(附源码)
本着“没有捏脸系统算什么RPG”的想法,着手做一个2d简易捏脸demo.其实换装游戏都差不多啦~ github代码地址:Simple-Character-Edit-System (Unity版本:5. ...
- springboot03-unittest mockmvc单元测试
整个项目结构: 定义user实体类 package com.mlxs.springboot.dto; import java.util.HashMap; import java.util.Map; / ...
- [C++]线性链表之顺序表<一>
顺序表中数据元素的存储地址是其序号的线性函数,只要确定了存储顺序表的起始地址(即 基地址),计算任意一个元素的存储地址的时间是相等的,具有这一特点的存储结构称为[随机存储]. 使用的基本数据结构:数组 ...
- spring cloud(学习笔记)微服务启动错误(1)
今天下午在启动spring cloud微服务的时候,报了这个错误: Error starting ApplicationContext. To display the auto-configurati ...
- whatis命令,一个非常有用的命令
比如我不知道yum的配置文件yum.conf怎么用,就可以whatis yum.conf,
- Linux 学大纲
- ubuntu14.04安装opencv-python
系统:ubuntu14.04 已安装:python2.7 需求:安装opencv-python 问题:python import cv2报错: 解决: pip install -i https:// ...
- 经典视觉SLAM框架
经典视觉SLAM框架 整个视觉SLAM流程包括以下步骤: 1. 传感器信息读取.在视觉SLAM中主要为相机图像信息的读取和预处理. 2. 视觉里程计(Visual Odometry,VO).视觉里程计 ...
- RabbitMQ简单应用の消息持久化
消息应答: 消息应答默认是打开的(false) boolean autoAck = true;自动确认模式,表示一旦MQ将消息给到消费者,就会从内存中删除该条消息,这种情况下,如果杀死正在执行的消费者 ...