Vue项目启动时自动获取本机IP地址

前言

在启动vue项目时，我们发现需要自己配置启动的ip地址，这样在多人开发便显得很不方便。

解决方案：

使用vue-cli构建项目：（其他配置类似）

vue init webpack myproject

1.在当前的build目录下新建一个get-ip.js文件用来获取本机ip地址

// build/get-ip.js

var os = require('os'), ip = '', ifaces = os.networkInterfaces() // 获取本机ip
out:
for (var i in ifaces) {
  for (var j in ifaces[i]) {
    var val = ifaces[i][j]
    if (val.family === 'IPv4' && val.address !== '127.0.0.1') {
      ip = val.address
      break out
    }
  }
}
module.exports = ip

2.引入

// webpack.dev.conf.js
const IP = require('./get-ip')
const HOST = process.env.HOST
...
devServer: {
	...
	host: HOST || config.dev.host || IP
}
// 当HOST和config.dev.host不存在时则使用本机IP

3.启动：

npm start