在同一局域网下通过手机访问本地Vue项目 |
您所在的位置：网站首页 › vue项目怎么打开 › 在同一局域网下通过手机访问本地Vue项目 |
在同一局域网下通过手机访问本地Vue项目
|
在同一局域网下通过手机访问本地Vue项目
修改Vue项目配置查询PC端局域网地址手机端访问系统如果上述配置无法正常访问则需更多配置
有时需要快速在手机端查看本地开发的移动端系统效果。无需部署到服务器就可以进行访问和测试，更加方便真机调试。 修改Vue项目配置修改根目录的config的index.js，如下： module.exports = { dev: { // Paths assetsSubDirectory: 'static', assetsPublicPath: '/', proxyTable: {}, host: '0.0.0.0', // 将此处localhost 修改为 '0.0.0.0',0.0.0.0意义相当于*，表示所有 port: 8080, autoOpenBrowser: false, } }主要是host项和port两项 查询PC端局域网地址获取IP方法： 打开CMD，输入 ipconfig , 就可以查到自己的局域网IP地址，比如我的： 192.168.0.191 这样用手机访问 IP 加端口号即可，访问192.168.0.191:8080就可以打开项目了。 注意：手机和电脑必须在同一局域网下才能访问 如果上述配置无法正常访问则需更多配置需要配置一下电脑的防火墙，把所需的端口（如：8080）打开。 设置方法如下： Windows 10 ，搜索“控制面板”，打开，Windows 7 可以直接在开始菜单打开。点击“Windows Defender防火墙”——“高级设置”——新建“入网规则”。2.3 规则类型选择“端口”2.4 下一步“特定本地端口”填 8080-8088 （此处是一个 IP 段，因为如果打开多个项目，端口会被占用， Vue会自动分配一个新的端口。如：8081 ）。 下一步“允许连接”下一步选择开放的场景，注意一定要选前两个  下一步输入规则名称，点击“完成”即可
|
【本文地址】