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 相关文章推荐
Javascript调用XML制作连动下拉列表框
Jun 25 Javascript
JS解密入门 最终变量劫持
Jun 25 Javascript
JavaScript对象创建及继承原理实例解剖
Feb 28 Javascript
7个JS基础知识总结
Mar 05 Javascript
Juery解决tablesorter中文排序和字符范围的方法
May 06 Javascript
jQuery Mobile中的button按钮组件基础使用教程
May 23 Javascript
JSON格式的时间/Date(2367828670431)/格式转为正常的年-月-日 格式的代码
Jul 27 Javascript
JS实现基于拖拽改变物体大小的方法
Jan 23 Javascript
vue.js实现数据库的JSON数据输出渲染到html页面功能示例
Aug 03 Javascript
js刷新页面location.reload()用法详解
Dec 09 Javascript
JS数组push、unshift、pop、shift方法的实现与使用方法示例
Apr 29 Javascript
Vue使用axios引起的后台session不同操作
Aug 14 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
谈一谈收音机的高放电路
2021/03/02 无线电
用PHP查询搜索引擎排名位置的代码
2010/01/05 PHP
curl实现站外采集的方法和技巧
2014/01/31 PHP
函数中使用require_once问题深入探讨 优雅的配置文件定义方法推荐
2014/07/02 PHP
php array_reverse 以相反的顺序返回数组实例代码
2017/04/11 PHP
PHP微信公众号开发之微信红包实现方法分析
2017/07/14 PHP
用JavaScript事件串连执行多个处理过程的方法
2007/03/09 Javascript
javascript基础知识大集锦(一) 推荐收藏
2011/01/13 Javascript
JS高级笔记
2011/07/13 Javascript
解决Extjs 4 Panel作为Window组件的子组件时出现双重边框问题
2013/01/11 Javascript
利用毫秒减值计算时长的js代码
2013/09/22 Javascript
两种方法实现在HTML页面加载完毕后运行某个js
2014/06/16 Javascript
JavaScript中join()方法的使用简介
2015/06/09 Javascript
原生js与jQuery实现简单的tab切换特效对比
2015/07/30 Javascript
CascadeView级联组件实现思路详解(分离思想和单链表)
2016/04/12 Javascript
Angular弹出模态框的两种方式
2017/10/19 Javascript
web前端vue实现插值文本和输出原始html
2018/01/19 Javascript
举例讲解Linux系统下Python调用系统Shell的方法
2015/11/07 Python
使用Python编写简单的端口扫描器的实例分享
2015/12/18 Python
python2.7无法使用pip的解决方法(安装easy_install)
2018/04/03 Python
Python实现ping指定IP的示例
2018/06/04 Python
python使用pandas处理大数据节省内存技巧(推荐)
2019/05/05 Python
对django layer弹窗组件的使用详解
2019/08/31 Python
浅析python内置模块collections
2019/11/15 Python
python能开发游戏吗
2020/06/11 Python
通过实例解析python and和or使用方法
2020/11/14 Python
使用pandas读取表格数据并进行单行数据拼接的详细教程
2021/03/03 Python
Allsole美国/加拿大:英国一家专门出售品牌鞋子的网站
2018/10/21 全球购物
金讯Java笔试题目
2013/06/18 面试题
教师研修随笔感言
2014/01/23 职场文书
大学学习计划书范文
2014/05/02 职场文书
奥林匹克的口号
2014/06/13 职场文书
2015年中秋节主持词
2015/07/30 职场文书
浅谈mysql增加索引不生效的几种情况
2021/06/23 MySQL
Feign调用传输文件异常的解决
2021/06/24 Java/Android
Java工作中实用的代码优化技巧分享
2022/04/21 Java/Android