目录
前言
二.操作程序
引入获取网络IP地址js的文件
更改devServer的配置
补充
总结
前言： vue-cli和react-cli为我们配置了网络。 手机WLAN连接到我们的电脑后，您可以通过在手机上输入WLAN的地址和端口号访问本地项目进行调试。 但是，如果不使用这些框架的支架，而只是在webpack中开发项目，则必须自己配置Network进行实机调试。
然后配置网络。
二.操作程序
引入获取NetworkIP地址js的文件，然后在项目根目录下创建getNetworkIp.js文件。 名字可以定制。
/* getNetworkIp.js用于获取WLAN地址*/constos=require('OS ) )。 function getNetworkIp () { let needHost=' '； //获取打开的主机树{//网络接口列表let network=OS.network interfaces (； WLAN的接口let alias=network['WLAN']； console.log (网络[ ' WLAN ' ]； for(letI=0； i alias.length； I () IPv4的地址if (alias [ I ] [ ' family ' ]==' IP v4 ' alias [ I ] [ ' address ' ]！=='127.0.0.1 '！ alias [ I ] [ ' internal ' ] } { need host=alias [ I ] [ '地址' ]； }}catch(e ) { needHost='localhost '； }返回新主机； }module.exports=getNetworkIp
2 .修改devserver配置以将getNetworkIp.js文件导入webpack.config.js，然后在webpack.config.js文件中修改devserver选项的主机。
/* webpack.config.js*//*此处省略了部分部署文件语法，getNetworkIp.js文件*/constgetnetworkip=require (./getnetworkip module.exports={ /*此处省略了一些配置选项。 读者只需关注devServer选项，*/devserver : { compress 3360 true，port: 8001，//修改主机为getnetworkip (主机：千兆网络自己PPS3360tps
补充
此外，devserver.host='0.0.0.0' ('0.0.0.0'表示所有网络地址)也可以使用WLAN地址和端口号进行web访问。 但是，如果您不想通过在cmd中输入ipconfig来验证WLAN地址并手动输入，则配置全零地址并不是一个好选择。
将getNetworkIp.js文件添加到摘要根目录中。 在webpack.config.js中导入文件，并在devServer的host属性中调用该文件。 除了上述方法的配置外，还可以直接配置devServer.host='0.0.0.0'。