webpack构建的项目配置ip运行地址

我们平常在做vue或者react项目时，往往会使用脚手架直接搭建，有些脚手架会封装好使用本地的ip进行项目的访问，但是有些时候我们使用npm run dev或者npm start运行项目，发现只有localhost:8080类似的访问地址，这个时候如果我们有额外的需求，不如用手机来访问看看效果，会发现localhost这个地址是生成不了二维码的，这个时候我们就需要自己动手去配置。目前我所了解的方式有三种：

1. webpack.config.js文件中配置
   如果是自己使用webpack搭建的项目，往往有一个webpack.config.js的文件，在与module属性同级的对象中，添加一个devServer属性，如图所示：
   
   注：10.8.0.92为我本地的ip地址，具体的ip地址根据自己的服务器ip地址决定，port为端口号，这样运行之后我通过访问10.8.0.92:8888即可访问该项目，如图所示：
   

2. 2.webpack的config配置文件

   我们平常使用vue-cli，配合webpack搭建起一个项目，我们在package.json中查看运行的命令：