【VS Code插件开发】自定义指令实现 git 命令 （九）

🐱 个人主页：不叫猫先生，公众号：前端舵手
🙋‍♂️ 作者简介：前端领域优质作者、阿里云专家博主，共同学习共同进步，一起加油呀！
✨优质专栏：VS Code插件开发极速入门
📢 资料领取：前端进阶资料可以找我免费领取

在这里插入图片描述

我们通常会通过小乌龟、SourceTree、终端等实现 git 的相关操作，VS Code 开发工具也提供了 git 相关的操作 ，那么在VS Code中如何通过自定义命令实现 git 的相关操作？本文主要介绍了git clone、git add、 git commit 、git push等命令的实现。

创建终端

  1. 异步函数声明:

    async function executeGitCommand(command, options) {

    用于执行 Git 命令。command 参数表示要执行的 Git 命令字符串，options 参数是一个对象，包含了执行命令的选项。

  2. 检查终端是否存在:

    if (!terminal){terminal = vscode.window.createTerminal(terminalOptions);
}

    检查全局变量 terminal 是否存在，如果不存在则创建一个新的终端。vscode.window.createTerminal 方法用于创建一个终端，terminalOptions 可能是在代码的其他地方定义的终端选项。

  3. 获取终端进程 ID:

    const pid = await terminal.processId;

    使用 await 关键字获取终端的进程 ID。这样可以在需要时使用进程 ID 进行其他操作，例如监控或结束进程。

  4. 发送 Git 命令到终端:

    terminal.sendText(command);

    使用 terminal.sendText 方法将 Git 命令发送到终端。这使得可以通过代码自动执行一系列 Git 命令。

  5. 显示终端:

    terminal.show();

    最后，使用 terminal.show 方法显示终端。这确保用户可以看到终端中执行的命令输出。

总体而言，这个函数的作用是在 VSCode 中执行 Git 命令，并通过终端显示命令的执行结果。该函数假设 terminal 是一个在全局范围内定义的终端变量，并在需要时创建。

async function executeGitCommand(command, options) {if (!terminal){terminal = vscode.window.createTerminal(terminalOptions);}const pid = await terminal.processId;terminal.sendText(command);terminal.show();
}

创建终端的命令再后续执行git命令时需要用到。

git add .

注册gitAdd命令

async function activate(context) {vscode.commands.registerCommand('wxRead.gitAdd', () => {executeGitCommand('git add .', { name: 'Git Add' });})
}

command + shift +p 之后选择gitAdd

在这里插入图片描述
之后控制台就会出现下图：
在这里插入图片描述

git commit

  1. 命令注册:
    vscode.commands.registerCommand('wxRead.gitCommit', async () => {

使用 registerCommand 方法注册一个名为 'wxRead.gitCommit' 的命令。当用户执行这个命令时，将触发后面的回调函数。

  1. 创建输入框:

    const defaultCommitMessage = "Your default commit message here";
const input = await vscode.window.createInputBox();
input.prompt = "Enter your commit message";
input.value = defaultCommitMessage;
input.show();

    创建一个输入框，用于用户输入提交消息。设置输入框的提示信息为 "Enter your commit message"，并将默认值设置为 "Your default commit message here"。最后，通过 input.show() 显示输入框。
    在这里插入图片描述

  2. 监听输入框的 Accept 事件:

    input.onDidAccept(() => {

    使用 onDidAccept 事件监听器，当用户按下确认键（Enter）时触发。

  3. 获取提交消息:

    const commitMessage = input.value;

    获取用户在输入框中输入的提交消息。

  4. 销毁输入框:

    input.dispose();

    在获取提交消息后，销毁输入框，以避免占用资源。

  5. 执行 Git Commit 命令:

    if (commitMessage) {const commitCommand = `git commit -m "${commitMessage}"`;executeGitCommand(commitCommand, { name: 'Git Commit' });
}

    检查用户是否输入了提交消息，如果有则构建 git commit 命令，并调用 executeGitCommand 函数执行该命令。传递的第二个参数是一个对象，包含了执行命令的名称，这里设置为 'Git Commit'。

完整代码如下：

vscode.commands.registerCommand('wxRead.gitCommit', async () => {const defaultCommitMessage = "Your default commit message here";const input = await vscode.window.createInputBox();input.prompt = "Enter your commit message";input.value = defaultCommitMessage;input.show();input.onDidAccept(() => {const commitMessage = input.value;input.dispose();if (commitMessage) {const commitCommand = `git commit -m "${commitMessage}"`;executeGitCommand(commitCommand, { name: 'Git Commit' });}});})

git clone

  1. 注册gitClone命令后，在扩展程序中 command + shift +p （我是mac）之后选择wxRead.gitClone
    在这里插入图片描述

  2. 弹出输入框获取 Git 仓库 URL

    vscode.window.showInputBox({ prompt: 'Enter Git repository URL' }).then((gitRepoUrl) => {

    这一部分代码使用 showInputBox 方法弹出一个输入框，提示用户输入 Git 仓库的 URL。一旦用户输入完成，该输入的内容将作为参数传递给 then 函数中的回调函数，并存储在 gitRepoUrl 变量中。这里输入我的开源项目：https://github.com/zbsguilai/kedaxunfei.git
    在这里插入图片描述

  3. 随后会出现一个弹框，会让你选择一个文件作为项目的目录

  4. 显示进度条并执行克隆操作:

    vscode.window.withProgress({location: vscode.ProgressLocation.Notification,title: 'Cloning Git Repository',cancellable: false
}, async (progress, token) => {

    使用 withProgress 方法显示一个进度条，该进度条位于通知区域，标题为 ‘Cloning Git Repository’。这个进度条将在克隆操作期间显示。async (progress, token) => {...} 是一个异步函数，用于处理进度和取消操作。

  5. 检查 Git 仓库 URL 是否存在:

    if (gitRepoUrl) {

    确保用户提供了有效的 Git 仓库 URL。

  6. 弹出文件夹选择框:

    vscode.window.showOpenDialog({canSelectFolders: true,canSelectFiles: false,openLabel: 'Select Destination Folder'
}).then((folders) => {

    使用 showOpenDialog 方法弹出一个文件夹选择框，允许用户选择目标文件夹。选定的文件夹将在 folders 变量中。

  7. 执行 Git Clone 操作:

    const gitCloneProcess = spawn('git', ['clone', gitRepoUrl, cloneDirectory]);

    使用 Node.js 的 spawn 方法创建一个子进程，执行 git clone 命令。gitRepoUrl 是用户输入的 Git 仓库 URL，cloneDirectory 是用户选择的目标文件夹。

  8. 处理 Git 命令输出:

    gitCloneProcess.stdout.on('data', (data) => {console.log(data.toString());
});
gitCloneProcess.stderr.on('data', (data) => {console.error(data.toString());
});

    将 Git 命令的标准输出和标准错误输出打印到控制台，以便在调试时查看执行的详细信息。

  9. 处理 Git Clone 完成事件:

    gitCloneProcess.on('close', (code) => {console.log('Git clone process exited with code:', code);if (code === 0) {vscode.window.showInformationMessage('Git clone completed successfully.');} else {vscode.window.showErrorMessage('Git clone failed. Please check the URL and try again.');}
});

    当 Git Clone 进程完成时，检查其退出码。如果退出码为 0，显示成功消息；否则，显示错误消息。

完整代码如下：

 vscode.commands.registerCommand('wxRead.gitClone', () => {// 弹出输入框以获取用户提供的 Git 仓库 URLvscode.window.showInputBox({ prompt: 'Enter Git repository URL' }).then((gitRepoUrl) => {vscode.window.withProgress({location: vscode.ProgressLocation.Notification,title: 'Cloning Git Repository',cancellable: false}, async (progress, token) => {if (gitRepoUrl) {if (gitRepoUrl) {// 使用 QuickPick 来让用户选择目标文件夹vscode.window.showOpenDialog({canSelectFolders: true,canSelectFiles: false,openLabel: 'Select Destination Folder'}).then((folders) => {if (folders && folders[0]) {const cloneDirectory = folders[0].fsPath;// 执行 git clone 命令，将代码克隆到选定的目录const gitCloneProcess = spawn('git', ['clone', gitRepoUrl, cloneDirectory]);// 处理 Git 命令的输出gitCloneProcess.stdout.on('data', (data) => {console.log(data.toString());});gitCloneProcess.stderr.on('data', (data) => {console.error(data.toString());});gitCloneProcess.on('close', (code) => {console.log('Git clone process exited with code:', code); // 添加这行用于调试if (code === 0) {vscode.window.showInformationMessage('Git clone completed successfully.');}else {vscode.window.showErrorMessage('Git clone failed. Please check the URL and try again.');}});}});}}});});}));

git push

注册wxRead.gitPush命令，在扩展程序中 command + shift +p （我是mac）之后选择wxRead.gitPush

 vscode.commands.registerCommand('wxRead.gitPush', () => {executeGitCommand('git push', { name: 'Git Push' });})

好书推荐

TypeScript+React Web应用开发实战 ：京东直达

本书适应于当今前端开发的流行趋势，注重理论与实战相结合的思想，配合大量的、基础且实用的代码实例，帮助读者学习基于TypeScript语言规范的React框架开发的相关知识。全书内容通俗易懂、覆盖面广、充分翔实、重点突出，涵盖了TypeScript语言规范和React框架开发的方方面面。

全书内容共10章，TypeScript语言部分包括TypeScript语言基础与开发环境的搭建、TypeScript项目开发与配置、TypeScript语法规范和TypeScript语法高级特性等方面的内容；React框架部分包括React框架基础与开发环境的搭建，React语法、组件、状态与生命周期，React框架高级指引和React Hook新特性等方面的内容。同时，为了突出本书项目实战的特点，针对性地开发了两个Web项目应用，以帮助读者深入学习基于TypeScript + React技术的开发流程。

本书是学习基于TypeScript + React技术开发的实战图书，全书内容简明、代码精练、实例丰富。希望本书的内容能够帮助前端开发的初学者快速入门，尽快提高Web应用程序开发的技术水平。

在这里插入图片描述

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

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

相关文章

什么是VR虚拟现实体验店|VR主题馆加盟|元宇宙文化旅游

什么是VR虚拟现实体验店|VR主题馆加盟|元宇宙文化旅游

VR虚拟现实体验店是一种提供虚拟现实技术体验的场所。在这样的店铺里，顾客可以通过专业的设备和技术，体验虚拟现实技术带来的沉浸式感觉。 通常，这些商店提供一系列VR体验，包括互动游戏、沉浸式模拟、虚拟旅游和其他VR内容。客户可…
阅读更多...
【linux】02 ：Linux基础命令

【linux】02 ：Linux基础命令

1.掌握linux系统的目录结构 linux只有一个顶级目录，称之为：根目录。 windows系统有多个顶级目录，即各个盘符。 2.linux路径的描述方式 /在Linux中的表示：出现在开头表示根目录，出现在后面表示层级关系。 3.什么是命…
阅读更多...
Early if-conversion - 优化阅读笔记

Early if-conversion - 优化阅读笔记

Early if-conversion 用于对于没有很多可预测指令的乱序CPU。目标是消除可能误预测的条件分支。 来自分支两侧的指令都会被推测性地执行，并使用 cmov 指令选择结果。 // SSAIfConv 类在确定可能的情况下，对SSA形式的机器码执行if-conversion。该类不包…
阅读更多...
揭秘建筑类中级职称申报：是否能越过初级直接评审？

揭秘建筑类中级职称申报：是否能越过初级直接评审？

揭秘建筑类中级职称申报：是否能越过初级直接评审？ 很多人想知道越过初级直接评审建筑类中级职称可以不？ 关于越过初级职称/助理工程师直接申报建筑类中级职称，原则上是不行的，实际上分情况而定。如果你有二级建造师也…
阅读更多...
前端页面兼容pc和手机端设置，等比例缩小

前端页面兼容pc和手机端设置，等比例缩小

html页面 <meta name"viewport" content"widthdevice-width, initial-scale0, user-scalableyes,shrink-to-fitno">vue 在public里面的index.html里面设置 <meta name"viewport" content"widthdevice-width,initial-scale1.0,use…
阅读更多...
【数据结构和算法】-贪心算法

【数据结构和算法】-贪心算法

贪心算法&#xff08;又称贪婪算法&#xff09;是一种在每一步选择中都采取在当前状态下最好或最优&#xff08;即最有利&#xff09;的选择&#xff0c;从而希望导致结果是全局最好或最优的算法。贪心算法在有最优子结构的问题中尤为有效&#xff0c;它通过将问题分解为一系列…
阅读更多...
使用SpringBoot实现定时任务

使用SpringBoot实现定时任务

在Spring Boot中实现定时任务非常简单&#xff0c;主要通过使用Scheduled注解。Spring Boot的Scheduled注解提供了一种简单的、声明式的方式来定义定时任务。这些任务可以按照指定的时间间隔执行&#xff0c;无需手动管理线程或定时器。下面是如何使用Spring Boot来实现定时任务…
阅读更多...
linux ,Windows部署

linux ,Windows部署

Linux部署 准备好虚拟机 连接好查看版本&#xff1a;java -version安装jdk 解压命令&#xff1a;tar -zxvf 加jdk的压缩文件名cd /etc 在编辑vim profile文件 在最底下写入&#xff1a; export JAVA_HOME/root/soft/jdk1.8.0_151&#xff08;跟自己的jdk保持一致&#xff0…
阅读更多...
python 之pymongo的CURD

python 之pymongo的CURD

文章目录 pymongo的基本操作前言新增1、新增一条记录2、新增多条记录3、自定义_id 的新增 更新1、更新一条记录2、更新多条记录 删除删除一条记录删除多条记录 查询条件查询根据运算符查询根据范围查找根据正则表达式查询投影排序分页查询 管道聚合 pymongo的基本操作 前言 前…
阅读更多...
SpringSecurity 快速入门

SpringSecurity 快速入门

文章目录 1. 认证授权概述1.1 认证授权概念1.1.1 认证1.1.2 授权 1.2 权限数据模型1.3 RBAC权限模型1.3.1 介绍1.3.2 基于角色访问控制1.3.3 基于资源访问控制 1.4 常见认证方式1.4.1 Cookie-Session1.4.2 jwt令牌无状态认证 1.5 技术实现 2. SpringSecurity入门2.1 介绍2.2 入…
阅读更多...
突破编程_C++_设计模式（迭代模式）

突破编程_C++_设计模式（迭代模式）

1 迭代模式的基本概念 在 C 中&#xff0c;迭代模式是一种常见的设计模式&#xff0c;它用于遍历或处理集合中的元素。迭代模式允许程序员在不了解集合内部表示的情况下&#xff0c;以一种统一和一致的方式来访问集合中的元素。这种模式的核心是迭代器对象&#xff0c;它封装了…
阅读更多...
「CISP题库精讲」CISP题库习题解析精讲20道

「CISP题库精讲」CISP题库习题解析精讲20道

前言 本篇主要对CISP教材第九章《计算环境安全》的一些习题进行讲解&#xff0c;包括20道题&#xff0c;这里只是部分习题&#xff0c;针对第九章可能会多写几章的内容&#xff0c;如果我发布的这些习题里面没有你想找的那道题&#xff0c;你也可以直接私信我&#xff0c;我加…
阅读更多...
「连载」边缘计算（二十九）03-11：边缘部分源码（源码分析篇）

「连载」边缘计算（二十九）03-11：边缘部分源码（源码分析篇）

&#xff08;接上篇&#xff09; EdgeCore之matamanager 前面对EdgeCore组件的edged、devicetwin、edgehub、eventbus功能模块进行了分析&#xff0c;本节对EdgeCore组件的另一个功能模块metamanager进行剖析。metamanager作为EdgeCore中的edged模块与edgehub模块进行交互的桥…
阅读更多...
求根节点到叶节点数字之和

求根节点到叶节点数字之和

题目链接 求根节点到叶节点数字之和 题目描述 注意点 树中节点的数目在范围 [1, 1000] 内0 < Node.val < 9树的深度不超过10 解答思路 深度优先遍历计算从根节点到叶子节点组成的所有数字&#xff08;每向下一层乘以10&#xff09;&#xff0c;再计算所有的数字之和…
阅读更多...
中小型生产企业工业数据采集分析平台 规划生产流程

中小型生产企业工业数据采集分析平台 规划生产流程

工业数据采集分析平台是一款优秀的工控自动化软件&#xff0c;可以用于数据采集、实时监测和过程控制、数据传输、系统联动、远程监控等多种应用&#xff0c;数据采集平台通过对设备运行状态及相关参数监视实现保证每个环节都能按照既定方案进行&#xff0c;同时缩短非正常停机…
阅读更多...
shiro整合thymeleaf（接上一篇抛出的问题）

shiro整合thymeleaf（接上一篇抛出的问题）

在上一篇末尾&#xff0c;讲到如何实现不同身份的用户&#xff0c;有不同的权限&#xff0c;从而看到不同的页面&#xff0c;下面我们就来实现下这个功能 1.导入依赖 <!--shiro整合thymeleaf--><dependency><groupId>com.github.theborakompanioni</group…
阅读更多...
python(ogr)处理geojson为本地shp文件

python(ogr)处理geojson为本地shp文件

前言 本次所利用的geojson数据来自https://geo.datav.aliyun.com/areas_v3/bound/410000_full.json &#xff0c;如果觉得下方代码看起来不方便&#xff0c;可以来GitHub上来看&#xff0c;在这上面还有一些辅助内容便于理解 GISpjd/GIS-union-Python (github.com)https://gi…
阅读更多...
14.WEB渗透测试--Kali Linux（二）

14.WEB渗透测试--Kali Linux（二）

免责声明&#xff1a;内容仅供学习参考&#xff0c;请合法利用知识&#xff0c;禁止进行违法犯罪活动&#xff01; 内容参考于&#xff1a; 易锦网校会员专享课 上一个内容&#xff1a;13.WEB渗透测试--Kali Linux&#xff08;一&#xff09;-CSDN博客 netcat简介内容:13.WE…
阅读更多...
精品基于Springboot的体育用品租赁租用管理系统的设计与实现

精品基于Springboot的体育用品租赁租用管理系统的设计与实现

《[含文档PPT源码等]精品基于Springboot的体育用品管理系统的设计与实现[包运行成功]》该项目含有源码、文档、PPT、配套开发软件、软件安装教程、项目发布教程、包运行成功&#xff01; 软件开发环境及开发工具&#xff1a; Java——涉及技术&#xff1a; 前端使用技术&…
阅读更多...
c# DbHelper的封装

c# DbHelper的封装

c# DbHelper的封装 基于ADO.NET框架&#xff0c;封装了适用于多个关系型数据库的DbHelper。通过简洁明了的代码&#xff0c;实现了对各种数据库的高效操作。 public class DbHelper{private readonly DataBase _dataBase;public DbHelper(DataBase dataBase){_dataBase data…
阅读更多...
最新文章

Copyright @ 2022~2023