Vue项目启动后用局域网不能访问

今天来解决一个问题:基于Vite构建的Vue项目在启动后只能通过localhost这种形式访问

如果把localhost换成本主机的局域网ip地址之后页面无法访问了。

就连用127.0.0.1都无法访问。尝试多次之后,最后证明只有使用localhost这种形式才可以

Vue项目启动后用局域网不能访问_第1张图片

原因:基于Vite构建的Vue项目在一开始创建后,默认设置的是只能用localhost这种形式来访问

Vue项目启动后用局域网不能访问_第2张图片

想要真正实现让不同的设备能够访问我们做的web时,就需要解决这个问题,localhost 替换成本机 ip 地址之后无法访问。

解决措施:

下面给大家分析两种解决方法:

方法一:在package.json文件中设置如下

Vue项目启动后用局域网不能访问_第3张图片

方法二:在vite.config.js文件中设置如下

Vue项目启动后用局域网不能访问_第4张图片

好的,问题就分享到这里了,相信坚持就是胜利吧!

如果你觉得这篇内容对你有所启发或者帮助,请不要吝啬一个赞哦,让更多需要帮助的人看到它吧!

你可能感兴趣的:(vue.js,前端,javascript,json,前端框架,npm,node.js)