局域网内访问vue3项目|Network: use --host to expose

背景

我希望在相同的局域网内，通过手机访问我在Vue 3项目中展示的效果

遇到的问题

使用Vue CLI的–host选项实现局域网内的应用程序测试

当使用Vue CLI在本地提供服务时，通过使用 --host 选项，你可以指定要公开应用程序的主机。默认情况下，Vue CLI 提供的开发服务器只监听本地主机（localhost），这意味着只有在同一台计算机上的浏览器才能访问你的应用程序。通过指定一个公共的主机名，你可以使你的应用程序能够被网络中的其他设备访问，这对于在局域网中的其他设备上测试你的应用程序特别有用

解决方法

第一种方法

--host 0.0.0.0 选项告诉开发服务器监听所有的网络接口，而不仅仅是本地主机。这意味着你可以通过局域网中的其他设备来访问你正在开发的应用程序。【0.0.0.0 是一个特殊的 IP 地址，代表所有可能的 IP 地址。在网络编程中，它被用作通配符，表示在所有可用的网络接口上都监听】

第二种方法

效果：

同一局域网内设备访问

第一步：查看自己电脑的ip

第二步：
其他设备访问

注意

什么是同一局域网？ 同一局域网是接在同一个交换机或者同一个集线器（HUB）或同一个路由器上的设备或者同一网段上的设备，局域网是指在某一区域内由多台计算机互联成的计算机组，同一局域网不一定要接同一个交换机或者HUB。

最常见的就是多个设备连同一个wifi，这样理解起来更简单。