【VueJS】VueJS开发请求本地json数据的配置
VueJS开发请求本地json数据的配置,旧版本是build/dev-server.js,新版本是build/webpack.dev.conf.js。
VueJS开发请求本地json数据的配置,早期的vue-lic下面有dev-server.js和dev-client.js两文件,请求本地数据在dev-server.js里配置,最新的vue-webpack-template中已经去掉了dev-server.js和dev-client.js 改用webpack.dev.conf.js代替,所以配置本地访问在webpack.dev.conf.js里配置即可。
1. 旧版dev-server.js配置本地数据访问:
在const app = express()后,const compiler = webpack(webpackConfig)前配置即可。
2. 新版webpack.dev.conf.js配置本地数据访问:
在const portfinder = require(‘portfinder’)后添加
有的小伙伴配置后说不能访问,所有的修改配置都需要重新启动运行命令的:npm run dev才能生效,还有data.json数据也不能少,就放在根目录下与index.html同级。data.json的部分数据如下所示:
3. 访问本地接口
按照上面的步骤配置后就可以正确访问本地接口了。
http://localhost:8080/api/seller
http://localhost:8080/api/goods
http://localhost:8080/api/ratings
这是我们虽然得到正确的数据了,但是因为数据不是格式化的,看起来有些麻烦,我们可以安装Google的jsonview插件(我用的是Google浏览器),安装成功后即可格式化json数据
【VueJS】VueJS开发请求本地json数据的配置的更多相关文章
- vue开发请求本地模拟数据的配置方法(转)
VUE开发请求本地数据的配置,早期的vue-lic下面有dev-server.js和dev-client.js两文件,请求本地数据在dev-server.js里配置,最新的vue-webpack-te ...
- 手把手教你vue配置请求本地json数据
本篇文章主要介绍了vue配置请求本地json数据的方法,分享给大家,具体如下:在build文件夹下找到webpack.dev.conf.js文件,在const portfinder = require ...
- vue配置 请求本地json数据
第一步:在build文件夹下找到webpack.dev.conf.js文件,在const portfinder = require('portfinder')后添加 //第一步const expres ...
- ajax和axios请求本地json数据对比
AJAX 是一种在无需重新加载整个网页的情况下,能够更新部分网页的技术,通过在后台与服务器进行少量数据交换,AJAX 可以使网页实现异步更新.这意味着可以在不重新加载整个网页的情况下,对网页的某部分进 ...
- vue请求本地json数据
1.下载vue-resource插件 cnpm install vue-resource 1.2全局引入vue-resource: 在main.js import VueResource from ' ...
- VUE开发请求本地数据的配置,旧版本dev-server.js,新版本webpack.dev.conf.js
VUE开发请求本地数据的配置,早期的vue-lic下面有dev-server.js和dev-client.js两文件,请求本地数据在dev-server.js里配置,最新的vue-webpack-te ...
- iOS开发网络篇—JSON数据的解析
iOS开发网络篇—JSON数据的解析 iOS开发网络篇—JSON介绍 一.什么是JSON JSON是一种轻量级的数据格式,一般用于数据交互 服务器返回给客户端的数据,一般都是JSON格式或者XML格式 ...
- C#的百度地图开发(二)转换JSON数据为相应的类
原文:C#的百度地图开发(二)转换JSON数据为相应的类 在<C#的百度地图开发(一)发起HTTP请求>一文中我们向百度提供的API的URL发起请求,并得到了返回的结果,结果是一串JSON ...
- PHP/Post 提交请求获取json数据,并转化为所需要的数组
/** * Post 提交请求获取json数据,并转化为所需要的数组 */ function request_post($url = '', $param = '') { if (empty($url ...
随机推荐
- RK平台images打包细则【转】
本文转载自;https://blog.csdn.net/wangxueming/article/details/52808739 IMGs打包细节 平台: RK3288 背景: RK3288编译产生了 ...
- Contiki Etimer 模块
一.Etimer概述 Etimer提供产生时间事件(timed event)的机制,当设定好的timer到期时,将会给设定etimer的process发送一个PROCESS_EVENT_TIMER 事 ...
- capsule network——CNN仅仅考虑了“有没有”的问题,没有考虑feature map的结构关系。这个结构关系包括位置,角度等。Capsule layer的输出也跟feature map的max-pooling输出不同,capsule layer的输出是一个向量,这个向量包含了位置,大小,角度等信息,这是feature map仅能输出一个值所不具备的;训练比较慢
capsule network--<Dynamic Routing Between Capsules> from:https://zhuanlan.zhihu.com/p/31491520 ...
- selenium 经常用到的API
一.webdriver 属性及方法: 1.获取当前页面的 url driver.current_url 2 .获取窗口相关信息 get_window_position() 返回窗口x,y坐标 get_ ...
- win32com操作word(2):常用用法
一.对象的位置关系: 1.Range属性位于(部分): Selection__Section__Cell__Paragraph__Table__Bookmark__Comment__Row__List ...
- .DS_Store 文件是什么?Mac下面如何禁止.DS_Store生成
.DS_Store是Mac OS保存文件夹的自定义属性的隐藏文件,如文件的图标位置或背景色,相当于Windows的desktop.ini. 1,禁止.DS_store生成:打开 “终端” ,复制黏贴下 ...
- 【Lintcode】136.Palindrome Partitioning
题目: Given a string s, partition s such that every substring of the partition is a palindrome. Return ...
- 向nexus远程仓库里面添加JAR
向nexus远程仓库里面添加JAR 远程仓库:http://10.1.252.21:8081/nexus/index.html admin/admin123 方法一:手动 在左侧选择:Reposito ...
- 选中DataGrid的Cell而不是row
主要是针对DataGridCellsPresenter而不是SelectiveScrollingGrid,使用时DataGridRow应用这个style就可以了. <Style x:Key=&q ...
- ng2父子模块通信@ViewChild和@Inject
一.@ViewChild 父组件中使用@ViewChild拿到子组件的变量和方法(父组件可调用子组件的方法和变量) parent.component.ts: import { Component, O ...