在项目中运用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的

相关推荐
还鮟10 分钟前
靶机远程控制实验命令与入门实践(Linux)
linux·网络·安全
光影少年15 分钟前
Vue2 Diff和Vue 3 Diff实现及底层原理
前端·javascript·vue.js
59803541516 分钟前
【java工具类】小数、整数转中文大写
android·java·开发语言
2501_9462243119 分钟前
旅行记录应用统计分析 - Cordova & OpenHarmony 混合开发实战
javascript·harmonyos·harvester
傻啦嘿哟24 分钟前
隧道代理“请求监控”实战:动态调整采集策略的完整指南
前端·javascript·vue.js
JIngJaneIL24 分钟前
基于java + vue个人博客系统(源码+数据库+文档)
java·开发语言·前端·数据库·vue.js·spring boot
C_心欲无痕29 分钟前
vue3 - readonly创建只读的响应式对象
前端·javascript·vue.js
吃喝不愁霸王餐APP开发者35 分钟前
Java后端服务在对接全国性霸王餐API时的多数据中心部署与就近调用策略
java·开发语言
froginwe111 小时前
jQuery UI 实例
开发语言
这周也會开心1 小时前
128陷阱,==与equals区别
java·开发语言