本文详细解析Vue项目在局域网内无法被其他设备访问的问题。提供两种主流解决方案：一是通过命令行参数或修改配置文件指定host为0.0.0.0；二是针对Vue CLI 2.0进行具体配置。同时，重点介绍Windows防火墙入站规则的添加方法，确保端口开放，实现手机或同事电脑通过IP加端口号直接访问本地Vue项目，便于真机调试。
Vue项目在局域网环境下无法被其他设备访问是开发中常见的问题，通常涉及网络配置、服务器启动参数以及系统防火墙设置等多个环节。
方法一
首先，确保发起访问的设备与你运行Vue项目的电脑处于同一个网段，例如连接同一个Wi-Fi网络。
其次，尝试重启本地开发环境，通过特定的启动命令来允许外部访问。
如果使用yarn作为包管理器，可以执行命令：yarn run dev --host 0.0.0.0。这种方式无需修改项目的配置文件，直接通过命令行参数指定监听地址。
如果使用npm，执行命令：npm run dev --host。注意，这种方式可能需要预先修改config/index.js文件，将其中的host配置从'localhost'改为'0.0.0.0'，以允许非本地主机访问。
完成上述步骤后，其他设备可以通过输入你电脑的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 。
这样更加方便真机调试，无需部署到服务器就可以进行访问和测试。
以上为个人经验，希望能给大家一个参考，也希望大家多多支持本站。