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 学习笔记 element属性控制
Jul 23 Javascript
JavaScript判断DOM何时加载完毕的技巧
Nov 11 Javascript
js跨浏览器实现将字符串转化为xml对象的方法
Sep 25 Javascript
原生javascript实现图片按钮切换
Jan 12 Javascript
AngularJS向后端ASP.NET API控制器上传文件
Feb 03 Javascript
网页中右键功能的实现方法之contextMenu的使用
Feb 20 Javascript
解决jquery appaend元素中id绑定事件失效的问题
Sep 12 jQuery
es6在react中的应用代码解析
Nov 08 Javascript
vue 组件高级用法实例详解
Apr 11 Javascript
Vue组件通信中非父子组件传值知识点总结
Dec 05 Javascript
JavaScript实现横版菜单栏
Mar 17 Javascript
vue+node 实现视频在线播放的实例代码
Oct 19 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的$_FILES的临时储存文件与回收机制实测过程
2013/07/12 PHP
php循环创建目录示例分享(php创建多级目录)
2014/03/04 PHP
PHP反射机制用法实例
2014/08/28 PHP
PHP读取文件内容的五种方式
2015/12/28 PHP
php加密之discuz内容经典加密方式实例详解
2017/02/04 PHP
Laravel 手动开关 Eloquent 修改器的操作方法
2019/12/30 PHP
Code:findPosX 和 findPosY
2006/12/20 Javascript
JQuery 确定css方框模型(盒模型Box Model)
2010/01/22 Javascript
用JS实现3D球状标签云示例代码
2013/12/01 Javascript
jquery选择器大全 全面详解jquery选择器
2014/03/06 Javascript
js获取ajax返回值代码
2014/04/30 Javascript
实现js保留小数点后N位的代码
2014/11/13 Javascript
Javascript实现单张图片浏览
2014/12/18 Javascript
JavaScript使用Prototype实现面向对象的方法
2015/04/14 Javascript
基于JavaScript实现TAB标签效果
2016/01/12 Javascript
React 高阶组件入门介绍
2018/01/11 Javascript
Angular实现的进度条功能示例
2018/02/18 Javascript
Nuxt.js SSR与权限验证的实现
2018/11/21 Javascript
微信小程序五子棋游戏的棋盘,重置,对弈实现方法【附demo源码下载】
2019/02/20 Javascript
在JavaScript中使用严格模式(Strict Mode)
2019/06/13 Javascript
最简单的vue消息提示全局组件的方法
2019/06/16 Javascript
Nuxt.js的路由跳转操作(页面跳转nuxt-link)
2020/11/06 Javascript
[08:06]DOTA2-DPC中国联赛 正赛 PSG.LGD vs Elephant 选手采访
2021/03/11 DOTA
python实现将英文单词表示的数字转换成阿拉伯数字的方法
2015/07/02 Python
Python中关键字nonlocal和global的声明与解析
2017/03/12 Python
pandas 转换成行列表进行读取与Nan处理的方法
2018/10/30 Python
python实现图片彩色转化为素描
2019/01/15 Python
解决Pandas的DataFrame输出截断和省略的问题
2019/02/08 Python
PyCharm专业最新版2019.1安装步骤(含激活码)
2019/10/09 Python
在python tkinter界面中添加按钮的实例
2020/03/04 Python
pandas中的ExcelWriter和ExcelFile的实现方法
2020/04/24 Python
中外合拍动画首获奥斯卡提名,“上海出品”《飞奔去月球》能否拿下最终大奖?
2021/03/16 国漫
网上常见的一份Linux面试题(多项选择部分)
2014/09/09 面试题
七年级历史教学反思
2014/02/05 职场文书
课堂打架检讨书200字
2014/11/21 职场文书
2016年社区创先争优活动总结
2016/04/05 职场文书