vue-cli项目无法用本机IP访问的解决方法


Posted in Javascript onSeptember 20, 2018

所遇问题

启动vue-cli项目服务,用本机IP无法访问此网站,拒绝了我们的链接请求。从而无法从手机上预览效果

原因分析

在我们的bulid目录下有一个webpack.dev.config.js的配置文件,发现devServer对象里的host属性取自process.env.HOST || config.dev.host。

vue-cli项目无法用本机IP访问的解决方法

于是这里我们去查看config.dev.host。在我们的config目录下有一个index.js, 找到dev对象的host属性

vue-cli项目无法用本机IP访问的解决方法

发现该版本的vue-cli将host主机名定义为localhost, 从而导致了本地IP不能访问服务。

解决办法

将host重新定义为:0.0.0.0即可, 然后重启服务,发现localhost、127.0.0.1、本地IP均能正常访问,这样就可以用手机来预览效果啦

host: '0.0.0.0'

以上这篇vue-cli项目无法用本机IP访问的解决方法就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
用js脚本控制asp.net下treeview的NodeCheck的实现代码
Mar 02 Javascript
jQuery.extend()的实现方式详解及实例
Jun 29 Javascript
alert中断settimeout计时功能
Jul 26 Javascript
javascript常用正则表达式汇总
Jul 31 Javascript
JS中常用的输出方式(五种)
Jun 12 Javascript
使用jquery给指定的table动态添加一行、删除一行
Oct 13 Javascript
jquery.validate.js 多个相同name的处理方式
Jul 10 jQuery
小程序点击图片实现自动播放视频
May 29 Javascript
vue与原生app的对接交互的方法(混合开发)
Nov 28 Javascript
小程序实现抽奖动画
Apr 16 Javascript
在Vue项目中,防止页面被缩放和放大示例
Oct 28 Javascript
Node.js+Vue脚手架环境搭建的方法步骤
Mar 08 Javascript
vue项目中,main.js,App.vue,index.html的调用方法
Sep 20 #Javascript
解决vue脚手架项目打包后路由视图不显示的问题
Sep 20 #Javascript
微信小程序onLaunch异步,首页onLoad先执行?
Sep 20 #Javascript
vue3.0 CLI - 3.2 路由的初级使用教程
Sep 20 #Javascript
微信小程序使用gitee进行版本管理
Sep 20 #Javascript
jQuery easyui datagird编辑行删除行功能的实现代码
Sep 20 #jQuery
解决Vue-cli npm run build生产环境打包,本地不能打开的问题
Sep 20 #Javascript
You might like
PHP程序员编程注意事项
2008/04/10 PHP
php实现用于验证所有类型的信用卡类
2015/03/24 PHP
php set_include_path函数设置 include_path 配置选项
2016/10/30 PHP
php实现姓名根据首字母排序的类与方法(实例代码)
2018/05/16 PHP
JavaScript 在线压缩和格式化收藏
2009/01/16 Javascript
Jquery提交表单 Form.js官方插件介绍
2012/03/01 Javascript
script不刷新页面的联动前后代码
2013/09/18 Javascript
Jquery修改页面标题title其它JS失效的解决方法
2014/10/31 Javascript
有关json_decode乱码及NULL的问题
2015/10/13 Javascript
常常会用到的截取字符串substr()、substring()、slice()方法详解
2015/12/16 Javascript
Bootstrap组件(一)之菜单
2016/05/11 Javascript
浅谈EasyUi ComBotree树修改 父节点选择的问题
2016/11/07 Javascript
Jquery树插件zTree实现菜单树
2017/01/24 Javascript
js实现抽奖效果
2017/03/27 Javascript
详解基于Koa2开发微信二维码扫码支付相关流程
2018/05/16 Javascript
JavaScript中this用法学习笔记
2019/03/17 Javascript
webpack HappyPack实战详解
2019/10/08 Javascript
[02:23]完美世界全国高校联赛街访DOTA2第一期
2019/11/28 DOTA
详解python3百度指数抓取实例
2016/12/12 Python
Python简单计算文件MD5值的方法示例
2018/04/11 Python
关于pytorch多GPU训练实例与性能对比分析
2019/08/19 Python
Python在centos7.6上安装python3.9的详细教程(默认python版本为2.7.5)
2020/10/15 Python
美国五金商店:Ace Hardware
2018/03/27 全球购物
英国手机零售商:Carphone Warehouse
2018/06/06 全球购物
法国房车租赁网站:Yescapa
2019/08/26 全球购物
屈臣氏越南官网:Watsons越南
2021/01/14 全球购物
描述JSP和Servlet的区别、共同点、各自应用的范围
2012/10/02 面试题
计算机大学生职业生涯规划书范文
2014/02/19 职场文书
《特殊的葬礼》教学反思
2014/04/27 职场文书
2014年师德师风自我剖析材料
2014/09/27 职场文书
教师节寄语2015
2015/03/23 职场文书
学风建设主题班会
2015/08/17 职场文书
2021年pycharm的最新安装教程及基本使用图文详解
2021/04/03 Python
MySQL GRANT用户授权的实现
2021/06/18 MySQL
海贼王十大潜力果实,路飞仅排第十,第一可毁世界(震震果实)
2022/03/18 日漫
Python selenium绕过webdriver监测执行javascript
2022/04/12 Python