Vue项目配置在局域网下访问方式
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 。
这样更加方便真机调试，无需部署到服务器就可以进行访问和测试。
同一局域网下访问vue项目
同一局域网
在你的电脑上用快捷键windows + R打开cmd，使用ping + ip地址（想要访问你项目的那台电脑的ip地址），如果成功后就表示你们处于同一局域网下。
本机ip地址
在你的电脑上用快捷键windows + R打开cmd，使用ipconfig命令，就可以看到本机ip地址。
访问本地项目
当你成功执行上一步，确定你们处于同一局域网下后：在你的项目中找到config文件夹，找到index.js文件，你可以看到host:localhost(默认)，将localhost改成本机ip地址（放vue项目的那台电脑的ip地址，如不知道本机ip地址，可参考上一步）
保存后重新运行该项目，生成的新的访问地址就是处于同一局域网下都可访问该项目的地址。
总结
以上为个人经验，希望能给大家一个参考，也希望大家多多支持编程网。
免责声明：
① 本站未注明“稿件来源”的信息均来自网络整理。其文字、图片和音视频稿件的所属权归原作者所有。本站收集整理出于非商业性的教育和科研之目的，并不意味着本站赞同其观点或证实其内容的真实性。仅作为临时的测试数据，供内部测试之用。本站并未授权任何人以任何方式主动获取本站任何信息。
② 本站未注明“稿件来源”的临时测试数据将在测试完成后最终做删除处理。有问题或投稿请发送至: 邮箱/279061341@qq.com QQ/279061341
