vue 同局域网访问不到的问题及解决
vue 同局域网访问不到
方法一
1. 处于同一个网段（PS：连同一个WiFi）
2. 重启本地环境 ：
(1) yarn run dev --host 0.0.0.0(不需要修改配置文件)
(2) npm run dev --host (需要修改config/index.js ，把 host: 'localhost', 改为 host: '0.0.0.0')
3. 你电脑的IP + 本地项目的端口号 别人打开这个就可以访问你本地项目了（类似于：192.168.100.100:8089 ）
方法二
修改package.json文件添加
--host 192.168.1.199
vue项目配置在局域网下访问
1.vue配置
a.vue cli2.0配置如下
b.vue cli3.0不需要配置即可访问
2.如果上述配置无法访问则配置以下
需要配置一下电脑的防火墙，把所需的端口（如：8080）打开。
设置方法如下：
2.1 Windows 10 ，搜索“控制面板”，打开，Windows 7 可以直接在开始菜单打开。
2.2 点击“Windows Defender防火墙”——“高级设置”——新建“入网规则”。
2.3 规则类型选择“端口”
2.4 下一步“特定本地端口”填 8080-8088 （此处是一个 IP 段，因为如果打开多个项目，端口会被占用， Vue会自动分配一个新的端口。如：8081 ）。
2.5下一步“允许连接”
2.6下一步选择开放的场景，注意一定要选前两个
2.7下一步输入规则名称，点击“完成”即可
这样用手机访问电脑 IP 加端口号，192.168.1.11:8080 就可以打开项目了。
注意：手机和电脑必须在同一局域网下才能访问，同事电脑同理
获取IP 方法：
打开命令提示行工具，输入 ipconfig 回车, 就可以看到自己的IP了，比如我的 192.168.2.103 。
这样更加方便真机调试，无需部署到服务器就可以进行访问和测试。
以上为个人经验，希望能给大家一个参考，也希望大家多多支持脚本之家。
相关文章
vue2项目导出操作实现方法(后端接口导出、前端直接做导出)
这篇文章主要给大家介绍了关于vue2项目导出操作实现方法的相关资料,文中介绍的是后端接口导出、前端直接做导出,通过代码介绍的非常详细,对大家的学习或者工作具有一定的参考借鉴价值,需要的朋友可以参考下2024-05-05
这篇文章主要介绍了vue 判断元素内容是否超过宽度的方式，具有很好的参考价值，希望对大家有所帮助。一起跟随小编过来看看吧2020-07-07
vue-treeselect及el-tree点击节点获取上级节点的数据方式
这篇文章主要介绍了vue-treeselect及el-tree点击节点获取上级节点的数据方式，具有很好的参考价值，希望对大家有所帮助。如有错误或未考虑完全的地方，望不吝赐教2023-07-07
vue.extend与vue.component的区别和联系
这篇文章主要介绍了vue.extend与vue.component的区别和联系，本文通过实例代码给大家介绍的非常详细，具有一定的参考借鉴价值 ,需要的朋友可以参考下2018-09-09
Vue 是一款流行的JavaScript 框架，用于构建用户界面，在Vue2和 Vue3中，都存在一个名为toRefs的函数，但其行为在这两个版本中有所不同，这篇文章主要介绍了Vue2和Vue3中toRefs的区别,需要的朋友可以参考下2023-08-08
这篇文章主要介绍了vue实现商品列表的无限加载思路和步骤详解,基础思路是触底条件满足之后 page++,拉取下一页数据,结合实例代码给大家介绍的非常详细,需要的朋友可以参考下,2024-06-06
这篇文章主要介绍了Vue实现仿iPhone悬浮球的示例代码，文中通过示例代码介绍的非常详细，对大家的学习或者工作具有一定的参考学习价值，需要的朋友们下面随着小编来一起学习学习吧2020-03-03
本篇文章主要介绍了详解Vue爬坑之vuex初识 ，Vue 的状态管理工具 Vuex可以解决大型项目中子组件之间传递数据，有兴趣的可以了解下2017-06-06
在Vue开发过程中,常常会碰到这样一种情形：从页面A跳转到页面B后,点击浏览器回退按钮返回页面A时,页面数据却未刷新,依旧保持之前的状态,这一情况可能会给用户带来困扰,对用户体验产生不良影响,本文将深入探讨如何妥善处理此类问题,以保证回退页面时数据能够准确更新2024-11-11
本文主要介绍Vue.js中监听器和计算属性的相关知识点，包括对普通属性的监听、对对象的监听、对数组的监听，以及计算属性的Set方法，计算属性与监听器的区别等等2021-05-05
最新评论