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 相关文章推荐
jQuery Flash/MP3/Video多媒体插件
Jan 18 Javascript
JS延迟加载加快页面打开速度示例代码
Dec 30 Javascript
用Jquery.load载入页面后样式没了页面混乱的解决方法
Oct 20 Javascript
js实现的二级横向菜单条实例
Aug 22 Javascript
仅30行代码实现Javascript中的MVC
Feb 15 Javascript
微信小程序 动态绑定数据及动态事件处理
Mar 14 Javascript
Bootstrap下拉菜单Dropdowns的实现代码
Mar 17 Javascript
JS基于正则实现数字千分位用逗号分隔的方法
Jun 16 Javascript
AngularJS双向数据绑定原理之$watch、$apply和$digest的应用
Jan 30 Javascript
JS获取input[file]的值并显示在页面的实现方法
Mar 09 Javascript
vue中动态设置meta标签和title标签的方法
Jul 11 Javascript
Vue.js实现可编辑的表格
Dec 11 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中PDO方式实现数据库的增删改查
2015/05/17 PHP
PHP 超级全局变量相关总结
2020/06/30 PHP
在IE中调用javascript打开Excel的代码(downmoon原作)
2007/04/02 Javascript
js判断IE浏览器版本过低示例代码
2013/11/22 Javascript
jQuery动画效果animate和scrollTop结合使用实例
2014/04/02 Javascript
js控制输入框获得和失去焦点时状态显示的方法
2015/01/30 Javascript
js+html5实现canvas绘制圆形图案的方法
2015/06/05 Javascript
JS实现点击上移下移LI行数据的方法
2015/08/05 Javascript
Web Uploader文件上传插件使用详解
2016/05/10 Javascript
js简单判断flash是否加载完成的方法
2016/06/21 Javascript
利用jquery禁止外层滚动条的滚动
2017/01/05 Javascript
node.js操作mysql简单实例
2017/05/25 Javascript
JS实现弹出下载对话框及常见文件类型的下载
2017/07/13 Javascript
vue 组件使用中的一些细节点
2018/04/25 Javascript
从零开始用electron手撸一个截屏工具的示例代码
2018/10/10 Javascript
vue element动态渲染、移除表单并添加验证的实现
2019/01/16 Javascript
一些手写JavaScript常用的函数汇总
2019/04/16 Javascript
laravel-admin 与 vue 结合使用实例代码详解
2019/06/04 Javascript
JS操作字符串转数字的常见方法示例
2019/10/29 Javascript
vue-cli创建的项目中的gitHooks原理解析
2020/02/14 Javascript
利用Python yagmail三行代码实现发送邮件
2018/05/11 Python
python Tensor和Array对比分析
2020/01/08 Python
python实现跨年表白神器--你值得拥有
2021/01/04 Python
python制作微博图片爬取工具
2021/01/16 Python
HTML5 虚拟键盘出现挡住输入框的解决办法
2017/02/14 HTML / CSS
阿迪达斯比利时官方商城:adidas比利时
2016/10/10 全球购物
瑞典时尚耳机品牌:Urbanears
2017/07/26 全球购物
巴西独家产品和现场演示购物网站:Shoptime
2019/07/11 全球购物
Huda Beauty官方商店:化妆和美容产品
2020/09/05 全球购物
承诺书格式范文
2014/06/03 职场文书
车辆委托书范本
2014/10/05 职场文书
学生会感恩节活动方案
2014/10/11 职场文书
大国崛起日本观后感
2015/06/02 职场文书
节约用水广告语60条
2019/11/14 职场文书
spring cloud 配置中心native配置方式
2021/09/25 Java/Android
JavaScript ES6的函数拓展
2022/01/18 Javascript