vue 项目使用 webpack 构建自动获取电脑ip地址
1、开发 H5 时移动端,经常会使用真机进行调试本地环境、webpack 配置服务器好多脚手架写的都是固定的,而在团队开发中需要每人配置自己的本机 ip 进行开发,每次开启开发环境的都需要修改,并且还不能提到 git ,太麻烦了,所以找了方法,动态获取本机 ip 进行本地环境真机调试。
2、如果有其他人想看一下项目,难道每次都要打包发布一下才可以看到吗?将 localhost 改成电脑 ip 地址,在同一局域网下就可以看到你本地的项目,并不需要打包发布。
解决方案:
- windows 系统打开终端输入 ipconfig 可以查看电脑的IP地址;
- 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地址的更多相关文章
- Linux:自动获取静态IP地址,清空iptable,修改selinux脚本
自动获取静态IP地址,清空iptable,修改selinux脚本 环境:VMware 平台:centos6.8全新 功能: 1)应用ifconfig -a,route -n,cat /etc/reso ...
- 通过AWS的DHCP自动获取的IP地址是否会发生改变?
针对您的问题,分析如下:1.在一个VPC内,通过AWS的DHCP自动获取的IP地址,在如何情况下会发生改变?例如我把vpc的内所有100个ec2实例全部关闭,再全部重新打开,是否会发生IP地址变化的情 ...
- vue项目使用webpack构建的本地服务环境,在手机上访问调试
使用vue脚手架构建的项目,一般在本地localhost运行,配合浏览器的模拟调试工具开发. 如果想看真机环境,又不想build到线上. webpack能配置电脑本地内网环境指向公网访问的! 1.打开 ...
- 在Thinkphp3.2.3框架下实现自动获取客户端IP地址的get_client_ip()函数
在Thinkphp框架下使用get_client_ip()函数获取客户端IP地址十分方便: 一行代码便可以实现:$ip = get_client_ip(); 但当我们测试时会遇到后台获取的IP地址显示 ...
- 获取电脑 ip 地址 及系统
public static void main(String[] args) throws UnknownHostException { //获取电脑系统 结果:os.name:Windows 10 ...
- python编写的自动获取代理IP列表的爬虫-chinaboywg-ChinaUnix博客
python编写的自动获取代理IP列表的爬虫-chinaboywg-ChinaUnix博客 undefined Python多线程抓取代理服务器 | Linux运维笔记 undefined java如 ...
- Python 之自动获取公网IP
Python 之自动获取公网IP 2017年9月30日 文档下载:https://wenku.baidu.com/view/ff40aef7f021dd36a32d7375a417866fb84ac0 ...
- Java获取电脑IP、MAC、各种版本
Java代码获取电脑IP.MAC.各种版本 package com.rapoo.middle.action; import java.io.BufferedReader; import java.io ...
- 解决:win8.1 oepnvpn客户端 redirect-gateway def1无效,自动获取的IP没有网关问题
解决:win8.1 oepnvpn客户端 redirect-gateway def1无效,自动获取的IP没有网关问题 该问题是操作系统权限问题,需要将程序设置为以管理员模式运行和以windows7兼容 ...
随机推荐
- 让你提前认识软件开发(21):C程序中的定时器
版权声明:本文为博主原创文章.对文章内容有不论什么意见或建议.欢迎与作者单独交流.作者QQ(微信):245924426. https://blog.csdn.net/zhouzxi/article/d ...
- (七)JavaScript 函数
带有返回值的函数 JavaScript 变量的生存期 JavaScript 变量的生命期从它们被声明的时间开始. 局部变量会在函数运行以后被删除. 全局变量会在页面关闭后被删除.
- 04 python 初学(数据类型)
数据类型: 数字: 整数 int (integer) python3 已经不区分整型和长整型了,都叫整型 浮点型 float 复数 complex 布尔: True False 字符串 ...
- mysql 行转列 列转行
一.行转列 即将原本同一列下多行的不同内容作为多个字段,输出对应内容. 建表语句 DROP TABLE IF EXISTS tb_score; CREATE TABLE tb_score( id ) ...
- npm太慢, 淘宝npm镜像使用方法
淘宝 npm 地址: http://npm.taobao.org/ 如何使用 有很多方法来配置npm的registry地址,下面根据不同情境列出几种比较常用的方法.以淘宝npm镜像举例: 1.临时使用 ...
- python--递归(附利用栈和队列模拟递归)
博客地址:http://www.cnblogs.com/yudanqu/ 一.递归 递归调用:一个函数,调用的自身,称为递归调用 递归函数:一个可以调用自身的函数称为递归函数 凡是循环能干的事,递归都 ...
- Mysql多实例添加到开机自启的方法
Mysql多实例配置成功后,想让配置成开机自启. 首先看一下Linux启动的知识点,顺序如下. 1 加载内核2 执行init程序3 /etc/rc.d/rc.sysinit # 由init执行的第 ...
- 详解ES5和ES6的继承
ES5继承 构造函数.原型和实例的关系:每一个构造函数都有一个原型对象,每一个原型对象都有一个指向构造函数的指针,而每一个实例都包含一个指向原型对象的内部指针, 原型链实现继承 基本思想:利用原型让一 ...
- codeforces#552 D. Vanya and Triangles(几何)
题意:给出n个不同的点,问能组成多少个不同的三角形 题解:对于每个点对,我们生成一个直线,用a*x+b=y表示,用map记录ab,这样就确定了一个直线,这样我们就能算出有多少点是共线的,这样复杂度就是 ...
- c#中用sql存储过程
string connstr = ConfigurationManager.ConnectionStrings["ConnectionString"].ConnectionStri ...