目录

vue3系列vitevue3怎么配置通过ip和端口打开浏览器

vue3系列:vite+vue3怎么配置通过ip和端口打开浏览器


1.前言

想要使用 IP+端口号 的方式访问页面,结果无法访问

https://i-blog.csdnimg.cn/direct/056e9e81302c4589ae95deaf5b178647.png

查了些资料,原来是vite.config.js需要加一些配置才能让他通过IP访问,默认的只能 localhost:端口号 访问

2.修改前的

使用vue3默认创建的 vite.config.js 配置为

https://i-blog.csdnimg.cn/direct/90e9881684c04a7b9ab03e3b680ecd4b.png

使用 npm run dev 后,

https://i-blog.csdnimg.cn/direct/c8ced9eb8da643959cf171e07ac5b779.png

3.修改后的

想要通过IP:端口号访问,配置文件增加 server

https://i-blog.csdnimg.cn/direct/11a161efeac34496a18dd0051a2a9b4c.png

重新执行 npm run dev ,如下

https://i-blog.csdnimg.cn/direct/c1b70d07a5c7486f93a280e45fba3d43.png

4.效果

通过访问

https://i-blog.csdnimg.cn/direct/19b34bb9076b424d9b58cead1eb539b2.png

5.其他

server中还可以进行其他配置

port: 修改端口号,比如8080被占用,可以修改为6060;

open: 设置自动打开浏览器,true自动打开,false不自动打开

希望本文能帮助到您,有其他问题请直接留言!