有时候,我前端写好了项目,想要给其他人看一下效果,可以选择将代码部署到test环境,也可以选择让外部通过ip来访问,不过前提是在同一个局域网下(比如连接同一个WiFi),下面介绍第二种方式。
修改dev命令首先我们需要先修改host地址,此处以vue3项目举例
页面启动之后如下
正常情况下,script下的dev命令是不会指定host的,我们可以在下面看到Local的地址为默认的.0.0.1,此时把这个网址发给别人肯定跑不起来。
所以我们可以指定host,比如0.0.0.0,允许所有ip访问
"dev":"vite--host=0.0.0.0",
修改完host后,windows系统的话,我们还需要关闭防火墙(苹果不需要)。重新启动项目可以看到
Network那里的网址,打马赛克的地方其实就是本机的ip地址,window输入cmd打开命令提示符,然后输入ipconfig即可查到ip地址,苹果的话,点击wifi小图标,同时按住option键即可查到ip地址。
在其他电脑或者手机访问浏览器中输入url即可看到相关页面,此方法也适用于手机端调试