在项目中运用os 模块获取本机ip地址并运用到终端启动成功打开network

一、安装os模块

os 模块是 Node.js 的内置模块,不需要额外安装

二、在项目中新建一个名为 getLocalIpAddress.js 的文件

javascript 复制代码
// getLocalIpAddress.js
const os = require('os');

function getLocalIpAddress() {
  const interfaces = os.networkInterfaces();
  for (const name of Object.keys(interfaces)) {
    for (const interface of interfaces[name]) {
      const {address, family, internal} = interface;
      if (family === 'IPv4' && !internal) {
        return address;
      }
    }
  }
  return '127.0.0.1'; // 返回默认的localhost地址,以防找不到合适的IPv4地址
}

module.exports = getLocalIpAddress;

三、在目标页面引入并运用

如在vue2项目的 webpack.dev.conf.js 文件顶部导入这个新函数

javascript 复制代码
const getLocalIpAddress = require('./getLocalIpAddress');

修改 compilationSuccessInfo.messages 部分来使用这个函数获取的 IP 地址

javascript 复制代码
devWebpackConfig.plugins.push(new FriendlyErrorsPlugin({
  compilationSuccessInfo: {
    messages: [
      `Your application is running here: http://localhost:${port}`,
      `Network URL: http://${getLocalIpAddress()}:${port}`, // 使用 getLocalIpAddress 函数获取 IP
    ],
  },
  onErrors: config.dev.notifyOnErrors
    ? utils.createNotifierCallback()
    : undefined
}))

这样终端加载成功以后从单局域网变成可以获取本地ip的

相关推荐
To_OC6 小时前
别再瞎写 React Router!7 个高频踩坑点一次性讲透
前端·javascript·react.js
BUG研究员_8 小时前
Runnable与LCEL
开发语言·人工智能·python
岭南灯火8 小时前
前端通用交互式几何编辑器的设计法则 3 - 数据对象的设计
前端·javascript·架构
岭南灯火9 小时前
前端通用交互式几何编辑器的设计法则 2 - 交互事件流
前端·javascript·架构
岭南灯火9 小时前
前端通用交互式几何编辑器的设计法则 1 - 入口的对象及其成员
前端·javascript·架构
珠***格9 小时前
双碳目标下:四可装置如何助力光伏消纳与碳数据上报
网络·人工智能·分布式·安全·边缘计算
满栀5859 小时前
Vue.js 接口封装最佳实践:从基础到高级
前端·javascript·vue.js
mounter6259 小时前
绕过主机:通过 Devmem TCP 运行 RDMA 应用
网络·网络协议·tcp/ip·rdma·devmem
牛艺翔10 小时前
C++基础
开发语言·c++
键盘会跳舞10 小时前
C++ :容器适配器stack源码级拆解
开发语言·c++··stack·先进后出