1、开发 H5 时移动端,经常会使用真机进行调试本地环境、webpack 配置服务器好多脚手架写的都是固定的,而在团队开发中需要每人配置自己的本机 ip 进行开发,每次开启开发环境的都需要修改,并且还不能提到 git ,太麻烦了,所以找了方法,动态获取本机 ip 进行本地环境真机调试。
2、如果有其他人想看一下项目,难道每次都要打包发布一下才可以看到吗?将 localhost 改成电脑 ip 地址,在同一局域网下就可以看到你本地的项目,并不需要打包发布。

解决方案:

  1. windows 系统打开终端输入 ipconfig 可以查看电脑的IP地址;
  2. mac 系统打开终端输入 ifconfig 可以查看电脑 ip;

但是每天 ip 发生变化这样就很麻烦,每天都需要重新获取,并且不能提交到 git,所以提供以下解决方案来获取电脑 ip,使用 node 里的 os 模块;
在 config 文件里的 index.js 里面加上以下代码:

const os = require('os');

function getNetworkIp() {
let needHost = ''; // 打开的host
try {
// 获得网络接口列表
let network = os.networkInterfaces();
for (let dev in network) {
let iface = network[dev];
for (let i = 0; i < iface.length; i++) {
let alias = iface[i];
if (alias.family === 'IPv4' && alias.address !== '127.0.0.1' && !alias.internal) {
needHost = alias.address;
}
}
}
} catch (e) {
needHost = 'localhost';
}
return needHost;
}

然后将 dev 里的 host 改成 getNetworkIp() 即可,代码如下:

dev: {
assetsSubDirectory: 'static',
assetsPublicPath: '/',
proxyTable: proxy,
host: getNetworkIp(),
port: 9528,
autoOpenBrowser: true,
errorOverlay: true,
notifyOnErrors: false,
poll: false,
useEslint: true,
showEslintErrorsInOverlay: false,
devtool: 'source-map',
cssSourceMap: false
}

其他用法:
os.EOL
定义操作系统一行结束的标识的常量。

os.arch()
返回操作系统 CPU 架构,可能的值有 “x64”、“arm” 和 “ia32”。

os.cpus()
返回一个数组对象,包括CPU的型号、速度、时间等。

os.endianness()
返回 CPU 的字节序,可能的是 “BE” 或 “LE”。
Little endian:将低序字节存储在起始地址。
Big endian:将高序字节存储在起始地址。

os.freemem()
返回操作系统空闲内存,单位是字节。

os.homedir()
返回当前用户的主目录。

os.hostname()
返回操作系统的主机名。

os.loadavg()
返回一个包含 1、5、15 分钟平均负载的数组。

os.platform()
返回操作系统平台。

os.release()
返回操作系统的发行版本。

os.tmpdir()
返回操作系统默认的临时文件目录。

os.totalmem()
返回系统内存总量,单位为字节。

os.type()
返回操作系统名称。

os.uptime()
返回操作系统运行的时间,以秒为单位。

vue 项目使用 webpack 构建自动获取电脑ip地址的更多相关文章

  1. Linux:自动获取静态IP地址,清空iptable,修改selinux脚本

    自动获取静态IP地址,清空iptable,修改selinux脚本 环境:VMware 平台:centos6.8全新 功能: 1)应用ifconfig -a,route -n,cat /etc/reso ...

  2. 通过AWS的DHCP自动获取的IP地址是否会发生改变?

    针对您的问题,分析如下:1.在一个VPC内,通过AWS的DHCP自动获取的IP地址,在如何情况下会发生改变?例如我把vpc的内所有100个ec2实例全部关闭,再全部重新打开,是否会发生IP地址变化的情 ...

  3. vue项目使用webpack构建的本地服务环境,在手机上访问调试

    使用vue脚手架构建的项目,一般在本地localhost运行,配合浏览器的模拟调试工具开发. 如果想看真机环境,又不想build到线上. webpack能配置电脑本地内网环境指向公网访问的! 1.打开 ...

  4. 在Thinkphp3.2.3框架下实现自动获取客户端IP地址的get_client_ip()函数

    在Thinkphp框架下使用get_client_ip()函数获取客户端IP地址十分方便: 一行代码便可以实现:$ip = get_client_ip(); 但当我们测试时会遇到后台获取的IP地址显示 ...

  5. 获取电脑 ip 地址 及系统

    public static void main(String[] args) throws UnknownHostException { //获取电脑系统 结果:os.name:Windows 10 ...

  6. python编写的自动获取代理IP列表的爬虫-chinaboywg-ChinaUnix博客

    python编写的自动获取代理IP列表的爬虫-chinaboywg-ChinaUnix博客 undefined Python多线程抓取代理服务器 | Linux运维笔记 undefined java如 ...

  7. Python 之自动获取公网IP

    Python 之自动获取公网IP 2017年9月30日 文档下载:https://wenku.baidu.com/view/ff40aef7f021dd36a32d7375a417866fb84ac0 ...

  8. Java获取电脑IP、MAC、各种版本

    Java代码获取电脑IP.MAC.各种版本 package com.rapoo.middle.action; import java.io.BufferedReader; import java.io ...

  9. 解决:win8.1 oepnvpn客户端 redirect-gateway def1无效,自动获取的IP没有网关问题

    解决:win8.1 oepnvpn客户端 redirect-gateway def1无效,自动获取的IP没有网关问题 该问题是操作系统权限问题,需要将程序设置为以管理员模式运行和以windows7兼容 ...

随机推荐

  1. Linux发展史-简简简易版

    "蛋-人-人-人" unix诞生 unix 贝尔实验室 人-谭教授 谭宁邦 minix mini unix 主要用于教学 人-斯托曼 stallman 我要开发出一个系统:自由 开 ...

  2. mongodb创建用户(转发)

    参考文档: https://www.cnblogs.com/itxiongwei/p/5520863.html MongoDB 缺省是没有设置鉴权的,业界大部分使用 MongoDB 的项目也没有设置访 ...

  3. zookeeper的原理,5分钟了解zookeeper

    一 .Zookeeper功能简介 ZooKeeper 是一个开源的分布式协调服务,由雅虎创建,是 Google Chubby 的开源实现.分布式应用程序可以基于 ZooKeeper 实现诸如数据发布/ ...

  4. 环境部署(五):Linux下安装Gradle

    Gradle是一个基于Apache的Ant和Maven的项目自动化构建工具,相比于Ant和Maven的局限性,Gradle可以更好的帮助管理项目中的差异.依赖.编译.打包.部署. 可以自定义满足自己需 ...

  5. Maven之profile实现多环境配置动态切换

            一般的软件项目,在开发.测试及生产等环境下配置文件中参数是不同的.传统的做法是在项目部署的时候,手动修改或者替换这个配置文件.这样太麻烦了,我们可以用Maven的profile来解决这 ...

  6. Django ORM模型:想说爱你不容易

    作者:Vamei 出处:http://www.cnblogs.com/vamei 严禁转载. 使用Python的Django模型的话,一般都会用它自带的ORM(Object-relational ma ...

  7. Pandas基础使用

    Pandas是基于NumPy的一种工具,该工具是为了解决数据分析任务而创建的. 1.导入pandas import pandas as pd 2.pandas数据类型: 1)Series:一维数据类型 ...

  8. JWT认证原理及使用

    一.JWT原理: 参考文章:https://www.jianshu.com/p/180a870a308a 1.传统的登录方式: 浏览器输入用户名密码,服务端校验通过,根据用户信息生成一个token,将 ...

  9. hdu6249 区间动态规划

    题目链接 题意:给出一些区间,求选k个区间能覆盖的最多点的数量 思路:定义dp[i][j]为前i个点取j个区间的最大值.dp[i][j]可以转移到dp[i+1][j+1]和以i+1为起点的区间终点 具 ...

  10. Linux登录MySQL时出现 Can't connect to local MySQL server through socket '/tmp/mysql.sock'解决方法

    在Linux上登录MySQL时出现如下提示,如下图: 通过查找资料了解到: MySQL有两种连接方式: (1)TCP/IP (2)socket 对mysql.sock来说,其作用是程序与mysqlse ...