关于新版vue-cli安装json-server在build文件里没生成出dev-server文件
今天在安装json-server时遇到一个问题,build文件里并没有生成dev-server.js文件,
开始是怀疑配置有问题,或者安装不正确,然后重新安装了两三次,还是这样,郁闷。。
通过查询资料得知,新版的vue-cli取消了dev-server.js和dev-client.js 改用webpack.dev.conf.js代替,所以 配置本地访问在webpack.dev.conf.js里配置即可
打开webpack.dev.conf.js,(在build目录下),
在const portfinder = require(‘portfinder’)后添加以下两行代码
const appData = require('./db.json')//加载本地数据文件,这个db.json是你自己自定义新建的文件名,存放路径随你吧,我这里测试就放在build目录里了,最后来解释这个db.json
const seller = appData.seller//获取对应的本地数据,
添加完以上代码继续在此文件里面向下查找devServer:{ }
在这个对象里添加配置,(不要删除或覆盖以前默认配置的值)
比如:(这里直接复制前辈的代码了)
before(app) {
app.get('/api/seller', (req, res) => {
res.json({
errno:0,
data: seller
})
})
},
然后,问题来了,
1、我自己的json数据写在哪里呢,是写在我自己创建的db.json里面吗,我去试了一下,没用。。。尴尬!
2、按照上面的配置完了,浏览localhost:8080/api/seller刷新浏览器没反应
3、localhost:8080/api/seller有反应了结果返回的{"erron":0}
解决
1.对于第一点的问题,经过自己反复测试,db.json里面必须有一对空的{},当然也可以写点数据进去,虽然不报错,但是也不知道有啥作用(本人小菜一枚,也没过多的去研究),但是没有{}肯定是要报错的
2.对于第2点,浏览器没反应的问题,一定要记住,当每更改过webpack.dev.conf.js这个文件或者db.json文件,记得重新 npm run dev
3.对于第3点,相信基本上的人已经看出来了,浏览器返回的{"erron":0}其实就是上面配置的
res.json({
errno:0,
data: seller
})
中的errno:0,那么就将他替换掉自己的json数据就行
res.json({
"getNewsList": [
{
"id": 1,
"title": "新闻条目1新闻条目1新闻条目1新闻条目1",
"url": "http://starcraft.com"
},
{
"id": 2,
"title": "新闻条目2新闻条目2新闻条目2新闻条目2",
"url": "http://warcraft.com"
},
{
"id": 3,
"title": "新闻条3新闻条3新闻条3",
"url": "http://overwatch.com"
},
{
"id": 4,
"title": "新闻条4广告发布",
"url": "http://hearstone.com"
}
],
data: seller
})
完
关于新版vue-cli安装json-server在build文件里没生成出dev-server文件的更多相关文章
- Vue技术点整理-Vue CLI安装详解
一,脚手架安装 Node 版本要求 Vue CLI 需要 Node.js +).你可以使用 nvm 或 nvm-windows 在同一台电脑中管理多个 Node 版本. 1,全局安装Vue CLI ...
- CDH版本的oozie安装执行bin/oozie-setup.sh prepare-war,没生成oozie.war?
不多说,直接上干货! 前期博客 Oozie安装部署 问题描述 bin/oozie-setup.sh prepare-war 解决办法 [hadoop@bigdatamaster bin]$ pwd / ...
- Vue Cli安装以及使用
因为公司项目要用vue框架,所以会用vue-cli来新建项目.用过vue的都知道,要全局安装vue以及脚手架vue-cli,然后执行vue init webpack projectname来新建v ...
- Vue CLI安装报错 npm ERR! Exit handler never called!
安装Vue CLI时报错: npm install –g vue-cli 试了四种办法 1.把全局安装-g放到后面 npm install @vue/cli –g 2.命令行输入 npm 缓存清理命令 ...
- vue cli 安装element-ui
1.安装elment-ui --save 参数:上线打包 MacBookPro:vue_test zhangxm$ npm install element-ui axios --save npm WA ...
- .vue文件里引用单独样式和js文件
style只能引一个,script可以引多个
- vue cli创建typescript项目
使用最新的Vue CLI @vue/cli创建typescript项目,使用vue -V查看当前的vue cli版本 安装命令 npm install -g @vue-cli 创建项目 vue cre ...
- 解决@vue/cli 创建项目是安装chromedriver时失败的问题
最近在使用新版vue的命令行工具创建项目时,安装chromedriver老是失败,导致后面的步骤也没有进行.网上搜索了一下,全是使用 工作中常见问题汇总及解决方案 npm install chrome ...
- Vue CLI 介绍安装
https://cli.vuejs.org/zh/guide/ 介绍 警告 这份文档是对应 @vue/cli 3.x 版本的.老版本的 vue-cli 文档请移步这里. Vue CLI 是一个基于 V ...
随机推荐
- mplayer使用心得[转]
一直在用mplayer,其他的播放器很少用.以下是我使用过程中的一些心得. 注意,下面用的路径都是在我的电脑上的路径,使用时请不要照抄!应该换成你的电脑上的正确路径. 一.首先还是讲安装方面的问题 ...
- 如何利用开源解码项目开发js视频解码的web应用 系列
介绍web上开发视频业务相关程序的技术演变历程 https://www.cnblogs.com/maoliangwu/articles/12046495.html 介绍ffmpeg asm.js we ...
- selenium 操作下拉处理
操作下拉框处理 在网页中,有时候会遇到下拉框处理,这时候使用Webdriver提供的select类来处理. ##操作下拉框处理 #coding = utf-8 from selenium import ...
- Codeforces_327_C
http://codeforces.com/problemset/problem/327/C 等比求和相加,有mod的出现,所以要算逆元. #include<iostream> #incl ...
- Android客户端OkHttp的使用以及tomcat服务器的解析客户端发过来的数据
2020-02-15 21:25:42 ### android客户端客户向服务器发送json字符串或者以参数请求的方式发送数据 其中又分为post请求和get请求 1.activity.xml < ...
- 《深入理解Java虚拟机》第2版挖的坑终于在第3版中被R大填平了
这是why技术的第34篇原创文章 本周还是在家办公的一周,上面的图就是我在家的工位,和上周<Dubbo Cluster集群那点你不知道的事>这篇文章里面的第一张图片比起来,升级了显示器支撑 ...
- EMC networker nmm can restore and recover sqlserver as different name to different location
EMC networker nmm can restore and recover sqlserver as different name to different location That is ...
- 你知道EasyX吗
关于C++控制台上的图形界面,你知道一个东西叫做EasyX吗? 作为一个退役的OI选手(WTF?\(3^2-3^1\)年级退役?),在退役之后总想找点事情做. 开发个游戏?(我只会控制台) 学下人工智 ...
- 如何在windows10家庭版上搭建docker
如何在windows10家庭版上搭建docker 建议先跳到最后一条,看完之后再决定是否安装. 0X00搭建原因 首先搭docker的想法是我在复现漏洞时候,发现大佬们的复现环境都是基于docker的 ...
- Python 模拟登录几种常见方法
方法一:直接使用已知的cookie访问 优点: 简单,但需要先在浏览器登录 原理: 简单地说,cookie保存在发起请求的客户端中,服务器利用cookie来区分不同的客户端.因为http是一种无状态的 ...