webpack项目打包console git分支、打包时间等信息 exec

相关链接

MDN toLocaleString

child_process Node.js

strftime 格式

代码

buildinfo.js

const { execSync, exec } = require("child_process");
// exec: 在 Windows 执行 bat 和 cmd 脚本// execSync 同步
// exec 异步// exec 使用方法
// exec('git show -s', function(error, stdout, stderr) {
//     if (error) {
//         // ...
//         return
//     }
//     console.log(stdout)
// })class BuildInfo {constructor() {}// 当前 git 分支branch() {// 为什么要使用 `${}`?// execSync 返回一个 <Buffer> 数据// typeof execSync('ls') -> objectreturn this.cleanEmpty(`${execSync("git rev-parse --abbrev-ref HEAD")}`)}// 本地最新 git 提交 hashhash() {return this.cleanEmpty(`${execSync("git show -s --format=%H")}`)}// 本地最新 git 提交记录// strftime 格式; 时间格式化参考/**yyyy: "%Y",YYYY: "%Y",MM: "%m",dd: "%d",HH: "%H",H: "%I",mm: "%M",ss: "%S",w: "%a",W: "%A",*/date() {return this.cleanEmpty(`${execute("git log -1 --format=%cd --date=format:%Y-%m-%d %H:%M:%S")}`)}// 打包时间/本地时间; (仅作参考:本机时间可以被修改)// 默认时间格式:2024/3/29 下午4:42:22// hour12: 是否使用12小时制格式buildtime() {return new Date().toLocaleString('zh-cn', { hour12: false })}// git 输出结果会有换行或空格等字符cleanEmpty(s) {return s.replace(/[\n\r\s]+$/, '')}
}module.exports = BuildInfo

vue.config.js

const BuildInfoTools = require('./buildinfo')
const webpack = require('webpack')const B = new BuildInfoTools()const plugins = [new webpack.DefinePlugin({BRANCH: JSON.stringify(B.branch()),HASH: JSON.stringify(B.hash()),BUILD_TIME: JSON.stringify(B.buildtime())})
]module.exports = {lintOnSave: false,configureWebpack: {plugins}
}

入口文件 main.js

import Vue from 'vue'new Vue({created() {console.log(`XXX Branch: ${BRANCH}; last.hash: ${HASH}; Build time: ${BUILD_TIME}`)},router,store,render: h => h(App)
}).$mount('#app')
一些问题
  1. 为什么要使用 JSON.stringify()?
    答:不转换会被识别为一个变量
    在这里插入图片描述

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/news/779027.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

SMBV100A罗德与施瓦茨SMBV100A信号源

181/2461/8938产品概述&#xff1a; 罗德与施瓦茨 SMBV100A 提供卓越的射频性能以及非常高的输出电平和较短的设置时间。同时&#xff0c;SMBV100A可配备内部基带发生器&#xff0c;以生成多种数字标准&#xff08;例如LTE、LTE-Advanced、IEEE802.11ac、GNSS&#xff09;。9 …

【C++杂货铺】内管管理

目录 &#x1f308;前言&#x1f308; &#x1f4c1; C/C中内存分布 &#x1f4c1; new 和 delete的使用 &#x1f4c1; new 和 delete的优点 &#x1f4c1; new 和 delete的原理 &#x1f4c2; operator new 和 operator delete函数 &#x1f4c2; 内置类型 &#x1f4c2…

Java中读取html文件转成String,展示在浏览器

这里写目录标题 第一章1.1&#xff09;pom中引入依赖和html文件示例1.2&#xff09;使用hutool工具包读取html文件转为string1.3&#xff09;页面显示 第一章 1.1&#xff09;pom中引入依赖和html文件示例 引入hutool工具包依赖 <dependency><groupId>cn.hutool&…

【C++程序员的自我修炼】基础语法篇(一)

心中若有桃花源 何处不是水云间 目录 命名空间 &#x1f49e;命名空间的定义 &#x1f49e; 命名空间的使用 输入输出流 缺省参数 函数的引用 引用的定义&#x1f49e; 引用的表示&#x1f49e; 引用的特性&#x1f49e; 常量引用&#x1f49e; 引用的使用场景 做参数 做返回值…

Docker进阶:Docker Swarm(集群搭建) —实现容器编排的利器

Docker进阶&#xff1a;Docker Swarm&#xff08;集群搭建&#xff09; —实现容器编排的利器 1、什么是Docker Swarm&#xff1f;2、Docker Swarm 与 Docker Compose的区别3、创建一个Swarm集群&#xff08;1-Manager&#xff0c;2-Worker&#xff09;1、资源准备2、初始化Swa…

使用Windows编辑工具直接编辑Linux上的代码

windows直接编辑Linux上代码 步骤如下&#xff1a; 1、按照samba 2、vim /etc/samba/smb.conf 3、输入以下内容 4 、重启下samba 输入以下内容 pkill smbd smbd 查看采用 ps -ef|grep smbd 给予文件权限&#xff1a; chmod 777 /code 5、winr 修改全选才能进入并且编写。…

快速上手Spring Cloud 六:容器化与微服务化

快速上手Spring Cloud 一&#xff1a;Spring Cloud 简介 快速上手Spring Cloud 二&#xff1a;核心组件解析 快速上手Spring Cloud 三&#xff1a;API网关深入探索与实战应用 快速上手Spring Cloud 四&#xff1a;微服务治理与安全 快速上手Spring Cloud 五&#xff1a;Spring …

vue3+ts白屏问题解决

文章目录 打开白屏解决方法可能出现问题使用base导致的使用baseUrl导致的 注意点vue3ts白屏问题知识分享 打开白屏 解决方法 在vue.config.js页面 添加publicPath:./, const { defineConfig } require(vue/cli-service)module.exports defineConfig({ transpileDependenci…

AcWing 4609:火柴棍数字 ← 贪心算法

【题目来源】 https://www.acwing.com/problem/content/4612/【题目描述】 给定 n 个火柴棍&#xff0c;你可以用它们摆出数字 0∼9。 摆出每个数字所需要的具体火柴棍数量如下图所示&#xff1a; 请你用这些火柴棍摆成若干个数字&#xff0c;并把这些数字排成一排组成一个整数…

Git版本管理使用手册 - 8 - 合并分支、解决冲突

合并整个开发分支 切换到本地test分支&#xff0c;选择右下角远程开发分支&#xff0c;选择Merge into Current。然后提交到远程test仓库。 合并某次提交的代码 当前工作区切换成test分支&#xff0c;选择远程仓库中的dev开发分支&#xff0c;选择需要合并的提交版本右击&a…

SQL Server 实验二:数据库视图的创建和使用

目录 第一关 相关知识 什么是表 操作数据表 创建数据表 插入数据 修改表结构 删除数据表 编程要求 第一关实验代码&#xff1a; 第二关 相关知识 视图是什么 视图的优缺点 视图的优点 视图的缺点 操作视图 创建视图 通过视图向基本表中插入数据 通过视图修改基本表的…

由浅到深认识Java语言(37):I/O流

该文章Github地址&#xff1a;https://github.com/AntonyCheng/java-notes 在此介绍一下作者开源的SpringBoot项目初始化模板&#xff08;Github仓库地址&#xff1a;https://github.com/AntonyCheng/spring-boot-init-template & CSDN文章地址&#xff1a;https://blog.c…

win10配置CLion2022+ubuntu20.04远程部署

背景 在博文ubunut搭建aarch64 cuda交叉编译环境记录中&#xff0c;使用的ubuntu20.04虚拟机安装eclipse来交叉编译aarch64的程序&#xff0c;然后发送到jetson板子上执行。开发一段时间后发现eclipse IDE使用起来不太便捷&#xff0c;因此&#xff0c;考虑使用CLion IDE&…

【数字孪生平台】使用 Three.js 以 3D 形式可视化日本新宿站地图

在本文中&#xff0c;我们将使用日本新宿站的室内地图数据&#xff0c;并使用 Three.js 将其进行 3D 可视化。更多精彩内容尽在数字孪生平台。 使用的数据 这次&#xff0c;我们将使用日本空间信息中心发布的“新宿站室内地图开放数据”的集成版本&#xff08;ShapeFile&#…

网络安全新视角:数据可视化的力量

在当今数字化时代&#xff0c;网络安全已成为各大企业乃至国家安全的重要组成部分。随着网络攻击的日益复杂和隐蔽&#xff0c;传统的网络安全防护措施已难以满足需求&#xff0c;急需新型的解决方案以增强网络防护能力。数据可视化技术&#xff0c;作为一种将复杂数据转换为图…

Weblogic10.3.6补丁升级

由oracle官方发布的漏洞公告&#xff0c;对weblogic进行补丁升级。本文介绍的是weblogic安装的版本为10.3.6.0&#xff0c;如果你使用的是其他版本的请根据实际版本来选择下载 对于weblogic补丁升级&#xff0c;具体步骤如下&#xff1a; 1、首先需要下载weblogic补丁程序 2…

简单了解原型模式

什么是原型模式 区别于单例模式&#xff0c;原型模式的一个类可以有多个实例化的对象。 原型模式通过拷贝来产生新的对象&#xff0c;而不是new&#xff0c;并且可以根据自己的需求修改对象的属性。 实现Cloneable接口实现拷贝 而拷贝又分为浅拷贝和深拷贝&#xff0c;两者在…

AI赋能微服务:Spring Boot与机器学习驱动的未来应用开发

&#x1f9d1; 作者简介&#xff1a;阿里巴巴嵌入式技术专家&#xff0c;深耕嵌入式人工智能领域&#xff0c;具备多年的嵌入式硬件产品研发管理经验。 &#x1f4d2; 博客介绍&#xff1a;分享嵌入式开发领域的相关知识、经验、思考和感悟。提供嵌入式方向的学习指导、简历面…

HarmonyOS入门--页面和自定义组件生命周期

文章目录 页面和自定义组件生命周期页面生命周期组件生命周期生命周期的调用时机 页面和自定义组件生命周期 生命周期流程如下图所示&#xff0c;下图展示的是被Entry装饰的组件&#xff08;首页&#xff09;生命周期。 自定义组件和页面的关系&#xff1a; 自定义组件&…

[flask]http请求//获取请求体数据

import jsonfrom flask import Flask, requestapp Flask(__name__)app.route("/form1", methods["post"]) def form1():"""获取客户端请求的请求体[表单]:return:""""""获取表单数据请求url&#xff1a;&qu…