vue-cli启动本地服务局域网不能访问的原因分析

 更新时间:2018年01月22日 16:11:35   作者:勤劳的蜜蜂  
这篇文章主要介绍了vue-cli启动本地服务,局域网下访问不到的原因分析,在文中还给大家介绍了vue-cli起的webpack项目 用localhost可以访问,但是切换到ip就不可以访问 的原因,本文给大家介绍的非常详细,需要的朋友参考下

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启动本地服务局域网不能访问不的原因分析,希望对大家有所帮助,如果大家有任何疑问请给我留言,小编会及时回复大家的。在此也非常感谢大家对脚本之家网站的支持!

相关文章

  • 关于Vue3中defineProps用法图文详解

    关于Vue3中defineProps用法图文详解

    在vue3中组件传参有很多种方式,和v2大差不差,但是有的地方还是有很多的区别,下面这篇文章主要给大家介绍了关于Vue3中defineProps用法的相关资料,需要的朋友可以参考下
    2022-11-11
  • Vue render渲染时间戳转时间,时间转时间戳及渲染进度条效果

    Vue render渲染时间戳转时间,时间转时间戳及渲染进度条效果

    这篇文章主要介绍了Vue render渲染时间戳转时间,时间转时间戳及渲染进度条效果,通过实例代码相结合的形式给大家介绍的非常详细,具有一定的参考借鉴价值,需要的朋友可以参考下
    2018-07-07
  • vue-router后台鉴权流程实现

    vue-router后台鉴权流程实现

    本文主要介绍了vue-router后台鉴权流程实现,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友们下面随着小编来一起学习学习吧
    2022-08-08
  • vue 指令版富文本溢出省略截取示例详解

    vue 指令版富文本溢出省略截取示例详解

    这篇文章主要为大家介绍了vue 指令版富文本溢出省略截取示例详解,有需要的朋友可以借鉴参考下,希望能够有所帮助,祝大家多多进步,早日升职加薪
    2022-09-09
  • vue-drag-chart 拖动/缩放图表组件的实例代码

    vue-drag-chart 拖动/缩放图表组件的实例代码

    这篇文章主要介绍了vue-drag-chart 拖动/缩放的图表组件的实例代码,本文通过实例代码给大家介绍的非常详细,对大家的学习或工作具有一定的参考借鉴价值,需要的朋友可以参考下
    2020-04-04
  • vue开发心得和技巧分享

    vue开发心得和技巧分享

    这篇文章主要为大家分享了vue开发心得和技巧,具有一定的参考价值,感兴趣的小伙伴们可以参考一下
    2016-10-10
  • vuex根据不同的用户权限展示不同的路由列表功能

    vuex根据不同的用户权限展示不同的路由列表功能

    最近接到一个新的需求,要求将系统的用户进行分类,用户登陆后根据不同的用户权限展示不同的功能列表。这篇文章主要介绍了vuex根据不同的用户权限展示不同的路由列表,需要的朋友可以参考下
    2019-09-09
  • mapbox gl开箱即用的地图引擎库

    mapbox gl开箱即用的地图引擎库

    这篇文章主要为大家介绍了一款mapbox gl开箱即用的地图引擎库,有需要的朋友可以借鉴参考下,希望能够有所帮助,祝大家多多进步,早日升职加薪
    2022-07-07
  • vue实现添加与删除图书功能

    vue实现添加与删除图书功能

    这篇文章主要介绍了vue实现添加与删除图书功能,非常不错,具有一定的参考借鉴价值,需要的朋友可以参考下
    2018-10-10
  • Vue使用Pinia轻松实现状态管理

    Vue使用Pinia轻松实现状态管理

    pinia,一个基于Vue3的状态管理库,它可以帮助开发人员管理Vue应用程序的状态,本文主要为大家介绍了Pinia的用法,感兴趣的小伙伴可以跟随小编一起学习一下
    2023-06-06

最新评论