vue-cli启动本地服务局域网不能访问的原因分析


Posted in Javascript onJanuary 22, 2018

1.问题描述:

     本地vue-cli启动了一个项目只能通过localhost:8080访问到,同一局域网下其他的手机和电脑并不能通过ip地址访问调试,

2.原因:vue-cli项目是通过命令行一键生成的,配置文件中默认生成的是本地调试模式,默认访问地址是localhost:端口号

3.改正的方式

    找到config文件夹下的index.js文件,修改host:“localhost”为 host:"0.0.0.0",此时同一局域网下的手机和其他电脑能通过ip查看到页面

PS:下面看下vue-cli起的webpack项目 用localhost可以访问,但是切换到ip就不可以访问

我用的是vux起的一个项目(移动端,基于vue的),因为是移动端的,需要在手机上测试,发现用http://localhost:8081/访问的挺好的,但是换到ip就访问不了,期初我以为是代理的原因,将电脑的代理给关掉了。还是不行,然后改为127.0.0.1访问,发现可以访问,用0.0.0.0访问也可以,就是ip不行。然后就各种google,百度。别人家的方法---都试了好多,发现没效(有点怀疑人生,怀疑是不是我电脑的问题),但是结果就在这,ip就是不可以访问!!!!

      本着一个程序员的本能--不解决这个bug,誓不罢休的精神。我开始看自己的build文件, config文件。最终找到了根源----在config里面的index.js里面的module.exports下面的dev下面的host:'localhost' 改为 host:'0.0.0.0',就可以访问啦!!!然后开心愉快的开始码代码!

总结

以上所述是小编给大家介绍的vue-cli启动本地服务局域网不能访问不的原因分析,希望对大家有所帮助,如果大家有任何疑问请给我留言,小编会及时回复大家的。在此也非常感谢大家对三水点靠木网站的支持!

Javascript 相关文章推荐
js预载入和JavaScript Image()对象使用介绍
Aug 28 Javascript
JQuery实现简单验证码提示解决方案
Dec 20 Javascript
javascript使用location.search的示例
Nov 05 Javascript
jQuery中click事件的定义和用法
Dec 20 Javascript
JavaScript中的条件判断语句使用详解
Jun 03 Javascript
js获取时间精确到秒(年月日)
Mar 16 Javascript
web前端开发upload上传头像js示例代码
Oct 22 Javascript
详谈表单重复提交的三种情况及解决方法
Aug 16 Javascript
JS图片延迟加载插件LazyImgv1.0用法分析【附demo源码下载】
Sep 04 Javascript
bootstrap时间控件daterangepicker使用方法及各种小bug修复
Oct 25 Javascript
在vue中使用Autoprefixed的方法
Jul 27 Javascript
js异步上传多张图片插件的使用方法
Oct 22 Javascript
webpack引入eslint配置详解
Jan 22 #Javascript
jquery在启动页面时,自动加载数据的实例
Jan 22 #jQuery
浅谈ajax在jquery中的请求和servlet中的响应
Jan 22 #jQuery
JavaScript中EventLoop介绍
Jan 22 #Javascript
element 结合vue 在表单验证时有值却提示错误的解决办法
Jan 22 #Javascript
基于vue2.x的电商图片放大镜插件的使用
Jan 22 #Javascript
vue 项目常用加载器及配置详解
Jan 22 #Javascript
You might like
PHP将XML转数组过程详解
2013/11/13 PHP
php获取本机真实IP地址实例代码
2016/03/31 PHP
PHP入门教程之面向对象基本概念实例分析
2016/09/11 PHP
php版交通银行网银支付接口开发入门教程
2016/09/26 PHP
OAuth认证协议中的HMACSHA1加密算法(实例)
2017/10/25 PHP
翻译整理的jQuery使用查询手册
2007/03/07 Javascript
麻雀虽小五脏俱全 Dojo自定义控件应用
2010/09/04 Javascript
javascript采用数组实现tab菜单切换效果
2012/12/12 Javascript
js实现图片旋转的三种方法
2014/04/10 Javascript
[原创]JavaScript语法高亮插件highlight.js用法详解【附highlight.js本站下载】
2016/11/01 Javascript
jQuery图片轮播(二)利用构造函数和原型创建对象以实现继承
2016/12/06 Javascript
tablesorter.js表格排序使用方法(支持中文排序)
2017/02/10 Javascript
JS常见创建类的方法小结【工厂方式,构造器方式,原型方式,联合方式等】
2017/04/01 Javascript
vue2 mint-ui loadmore实现下拉刷新,上拉更多功能
2018/03/21 Javascript
AngularJS使用Filter自定义过滤器控制ng-repeat去除重复功能示例
2018/04/21 Javascript
在Vuex使用dispatch和commit来调用mutations的区别详解
2018/09/18 Javascript
微信小程序实现日历签到
2020/09/21 Javascript
[01:09]DOTA2次级职业联赛 - 99战队宣传片
2014/12/01 DOTA
Python实现的监测服务器硬盘使用率脚本分享
2014/11/07 Python
Python使用sftp实现上传和下载功能(实例代码)
2017/03/14 Python
Python基于多线程实现抓取数据存入数据库的方法
2018/06/22 Python
APIStar:一个专为Python3设计的API框架
2018/09/26 Python
Python3爬虫爬取百姓网列表并保存为json功能示例【基于request、lxml和json模块】
2018/12/05 Python
python Django的web开发实例(入门)
2019/07/31 Python
python实现拉普拉斯特征图降维示例
2019/11/25 Python
使用PyOpenGL绘制三维坐标系实例
2019/12/24 Python
pytorch 模拟关系拟合——回归实例
2020/01/14 Python
中软国际Java程序员笔试题
2014/07/19 面试题
护士辞职信模板
2014/01/20 职场文书
最新奶茶店创业计划书
2014/01/25 职场文书
一年级语文教学反思
2014/02/13 职场文书
信用卡工资证明格式
2014/09/13 职场文书
课程设计感想范文
2015/08/11 职场文书
建筑工程挂靠协议书
2016/03/23 职场文书
nginx处理http请求实现过程解析
2021/03/31 Servers
python tkinter Entry控件的焦点移动操作
2021/05/22 Python