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 相关文章推荐
破除网页鼠标右键被禁用的绝招大全
Dec 27 Javascript
JavaScript网页制作特殊效果用随机数
May 22 Javascript
Javascript & DHTML 实例编程(教程)DOM基础和基本API
Jun 02 Javascript
一段批量给页面上的控件赋值js
Jun 19 Javascript
Javascript中的方法链(Method Chaining)介绍
Mar 15 Javascript
JS作为值的函数用法示例
Jun 20 Javascript
jquery插入兄弟节点的操作方法
Dec 07 Javascript
jQuery 实现鼠标画框并对框内数据选中的实例代码
Aug 29 jQuery
VUE 使用中踩过的坑
Feb 08 Javascript
Angularjs中date过滤器失效的问题及解决方法
Jul 06 Javascript
Webpack中loader打包各种文件的方法实例
Sep 03 Javascript
jquery实现弹窗(系统提示框)效果
Dec 10 jQuery
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实现的短网址算法分享
2014/06/20 PHP
[原创]PHP实现SQL语句格式化功能的方法
2017/07/28 PHP
PHP+AJAX 投票器功能
2017/11/11 PHP
滚动经典最新话题[prototype框架]下编写
2006/10/03 Javascript
一个用javascript写的select支持上下键、首字母筛选以及回车取值的功能
2009/09/09 Javascript
学习ExtJS Panel常用方法
2009/10/07 Javascript
js 多种变量定义(对象直接量,数组直接量和函数直接量)
2010/05/24 Javascript
js函数的引用, 关于内存的开销
2012/09/17 Javascript
jquery获取radio值(单选组radio)
2014/10/16 Javascript
jQuery实现购物车计算价格功能的方法
2015/03/25 Javascript
JS动态修改表格cellPadding和cellSpacing的方法
2015/03/31 Javascript
js实现的倒计时按钮实例
2015/06/24 Javascript
JS+CSS实现的经典tab选项卡效果代码
2015/09/16 Javascript
jQuery+PHP星级评分实现方法
2015/10/02 Javascript
功能强大的Bootstrap效果展示(二)
2016/08/03 Javascript
解决wx.onMenuShareTimeline出现的问题
2016/08/16 Javascript
javascript入门之string对象【新手必看】
2016/11/22 Javascript
JavaScript多态与封装实例分析
2018/07/27 Javascript
在JavaScript中查找字符串中最长单词的三种方法(推荐)
2021/01/18 Javascript
用javascript实现倒计时效果
2021/02/09 Javascript
python 中的列表解析和生成表达式
2011/03/10 Python
python基础教程之lambda表达式使用方法
2014/02/12 Python
java直接调用python脚本的例子
2014/02/16 Python
Python文件操作类操作实例详解
2014/07/11 Python
对python-3-print重定向输出的几种方法总结
2018/05/11 Python
Python实现base64编码的图片保存到本地功能示例
2018/06/22 Python
python并发编程多进程之守护进程原理解析
2019/08/20 Python
安装Pycharm2019以及配置anconda教程的方法步骤
2019/11/11 Python
利用Vscode进行Python开发环境配置的步骤
2020/06/22 Python
联想瑞士官方网站:Lenovo Switzerland
2017/11/19 全球购物
如何查找网页漏洞
2016/06/22 面试题
sleep()方法和wait()方法的区别是什么
2012/11/17 面试题
5.12护士节演讲稿
2014/04/30 职场文书
会计系毕业生求职信
2014/05/28 职场文书
中秋晚会活动方案
2014/08/31 职场文书
Python Django / Flask如何使用Elasticsearch
2022/04/19 Python