VS Code 插件开发概览

news2024/11/29 5:26:00

VS Code 插件开发概览

在这里插入图片描述

前言

VS Code作为开发者的代码开发利器,越来越受开发者的喜爱。像我身边的前端,每天80%的开发工作都是在VS Code上完成的。随着人们对它的使用,不再满足简单的优雅,舒服写代码这一基本需求。有些人利用它进行摸鱼,看小说,查股票,看文章,下五子棋。当你在VS Code的插件市场输入摸鱼二个字时,会有20多个插件供你选择。
本篇文章就来概述一下 VS Code的能力,并帮你快速建立插件文档的索引。

插件功能

插件能够实现以下功能

  • 自定义各类文件的图标和主题颜色
  • 添加自定义组件和UI
  • 使用html创建功能丰富的webview
  • 支持新的编程语言
  • 支持特殊的调试手段

组件的各大模块

案例大集合

插件的官方案例大集合 https://github.com/microsoft/vscode-extension-samples
看了这里提供的案例,能够了解大部分场景的开发范式。

每个插件的目录大致是相同的,这也是官方约定的标准插件目录。

UI组件

vscode提供了很标准的UI,在制作插件时要严格按照要求,比如图标的大小16*16的svg文件。

命令行工具

yogenerator-code

按照

# 安装依赖
npm install -g yo generator-code
yo code # 新建项目

按钮位置

你可以利用插件在vscode中注入很多的自定义按钮,各个位置。vscode支持的位置包括这些
https://code.visualstudio.com/api/references/contribution-points#contributes.menus

本地开发组件步骤

本地开发的步骤很简单

# 安装依赖
npm install -g yo generator-code
yo code # 新建项目

安装依赖后,按下F5键就会打开一个新的窗口,这是用于调试的。
修改代码后,重新reload 就能生效。

发布 https://code.visualstudio.com/api/working-with-extensions/publishing-extension

npm install -g @vscode/vsce

vsce package

vsce login <publisher name>

vsce publish

When 条件

在注入按钮时有时需要一些条件判断,
比如,当前打开的是某类文件时,才会显示某个按钮。
这些判断条件的编写应该遵循以下这个文档
https://code.visualstudio.com/api/references/when-clause-contexts

插件的概览 指导
https://code.visualstudio.com/api/extension-guides/overview

能够使用的VS code api
https://code.visualstudio.com/api/references/vscode-api#tasks.registerTaskProvider

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

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

相关文章

FA-PEG-MAL,叶酸-聚乙二醇-马来酰亚胺 实验用科研试剂;Folic acid PEG Maleimide

FA-PEG-MAL,叶酸-聚乙二醇-马来酰亚胺 中文名称&#xff1a;叶酸-聚乙二醇-马来酰亚胺 英文名称&#xff1a;Folic acid PEG Maleimide, FA-PEG-MAL 性状&#xff1a;固体或者粘稠液体&#xff0c;取决于分子量大小。 溶剂&#xff1a;溶于水、DMF、DMSO等常规有机溶剂 分…

Redis高级之IO多路复用和epoll(十二)

nginx 的反向代理也是采用了IO多路复用 1.是什么 I/O 网络 I/O 多路 多个客户端连接&#xff08;连接就是套接字描述符&#xff0c;即socket 或者 channel&#xff09;&#xff0c;指的是多条 TCP 连接 复用 用一个进程来处理多条的连接&#xff0c;使用单进程就能实现同时处…

【cmake学习】set_target_properties 常见属性以及获取target 属性

set_target_properties 的作用是设置目标的属性&#xff0c;可以是目标文件输出的名称或者目录、目标文件的版本号。与之对应的&#xff0c;我们可以使用 get_target_properties 来获取目标文件某一属性对应的值。 命令格式如下&#xff1a; set_target_properties(目标文件1…

凌恩生物美文分享|基于宏基因组的氮循环分析内容重磅升级!

元素循环是生物地球化学循环的重要环节&#xff0c;主要涉及碳、氮、磷、硫等元素的循环过程。凌恩生物强势推出基于宏基因组的氮循环研究方案&#xff0c;构建了完整的氮循环循环模式图&#xff0c;对宏基因组数据进行深入挖掘&#xff0c;各部分结果图可直接用于文章发表&…

NDK RTMP直播客户端三

在之前完成的实战项目【FFmpeg音视频播放器】属于拉流范畴&#xff0c;接下来将完成推流工作&#xff0c;通过RTMP实现推流&#xff0c;即直播客户端。简单的说&#xff0c;就是将手机采集的音频数据和视频数据&#xff0c;推到服务器端。 接下来的RTMP直播客户端系列&#xff…

Openssh 版本升级至8.4

目录 安装包下载地址 zlib包 openssl包 openssh 1、为了防止升级失败登陆不了&#xff0c;所以需要安装telnet 2、检查环境 2.1安装所需的相关组件 2.2备份原来的数据 2.3删除现有的安装sshd的相关软件包 3、下载所需的源码包 3.1编译安装sshd 3.2查看ssh命令的执…

XML文件检索技术:Xpath

纠正&#xff1a;上图中是通过根元素、父元素、子元素… Xpath检索方法及路径&#xff1a; 绝对路径代码示例&#xff1a; 47行&#xff1a;Xpath解析技术也是基于Dom4J的技术&#xff1b; 52行&#xff1a;List<Node> 创建Node类型的集合nameNodes&#xff0c;selec…

大数据应用开发--概述

大数据应用开发–概述 1. 大数据应用开发简介 1.1 数据分析的概念 数据分析就是利用数学、统计学理论相结合科学统计分析方法对数据库中的数据、Excel数据、收集的大量数据、网页抓取的数据进行分析&#xff0c;从中提取有价值的信息形成结论并进行展示的过程。 数据分析的目…

没想到大厂Adobe还有这些“猫腻”!

北京时间周四晚间&#xff0c;图像及视频生产力工具大厂Adobe发布公告&#xff0c;宣布旗下的视频创作应用Premiere Pro将喜提一系列新的AI功能。这也是Adobe上个月发布AIGC创作功能“萤火虫”后的最新动作。综合Adobe的官方公告和演示视频&#xff0c;最大亮点就是基于文字的视…

生存函数(Survival function)

文章目录1. 定义2. 生存函数的例子3. 参数生存函数3.1 指数生存函数&#xff08;Exponential survival function&#xff09;3.2 威布尔生存函数&#xff08;Weibull survival function&#xff09;3.3 其他参数生存函数4. 非参数生存函数5. 性质6. Kaplan–Meier estimator6.1…

总结824

学习目标&#xff1a; 4月&#xff08;复习完高数18讲内容&#xff0c;背诵21篇短文&#xff0c;熟词僻义300词基础词&#xff09; 学习内容&#xff1a; 英语&#xff1a;早上 读了《nasty place》&#xff0c;单词150个 高数&#xff1a;看了12讲二重积分的内容&#xff0…

算法设计与智能计算 || 专题六: 不可导凸函数的最优解搜索问题

不可导凸函数的最优解搜索问题 文章目录不可导凸函数的最优解搜索问题1. 次梯度下降方法1.1 基于次梯度的 Lasso 回归求解1.2 次梯度求解 Lasso 算法1.3 编程实现2. 软阈值方法2.1 软阈值求解Lasso回归1. 次梯度下降方法 如目标函数包含不可微分的部分&#xff0c;形如 E(w)1N…

计组2.3——浮点数的表示和运算

计组2.3 浮点数 #mermaid-svg-hwjyO2bt7hFXy1eD {font-family:"trebuchet ms",verdana,arial,sans-serif;font-size:16px;fill:#333;}#mermaid-svg-hwjyO2bt7hFXy1eD .error-icon{fill:#552222;}#mermaid-svg-hwjyO2bt7hFXy1eD .error-text{fill:#552222;stroke:#552…

视频美颜sdk的开发流程与注意事项

目前&#xff0c;视频美颜技术逐渐成为了人们关注的焦点。而视频美颜sdk作为实现视频美颜的重要工具&#xff0c;也因此备受关注。本文将从视频美颜sdk的开发流程和注意事项两个方面进行探讨。 一、视频美颜sdk的开发流程 1、确定需求 在进行视频美颜sdk的开发之前&#xff0…

Solon v2.2.10 发布,助力信创国产化

Solon 是一个高效的 Java 应用开发框架&#xff1a;更快、更小、更简单。它不是 Spring、没有使用 Servlet、JavaEE 接口&#xff0c;是一个有自己接口标准的开放生态。可以为应用软件国产化提供支持&#xff0c;助力信创建设。 150来个生态插件&#xff0c;覆盖各种不同的应用…

天猫数据分析:饮料市场头部份额下滑,无糖饮料占比40%

如今&#xff0c;全世界减糖、控糖的大趋势已经拉开帷幕。 根据沸点测评数据&#xff0c;今年所有在新加坡销售的饮料&#xff0c;必须在包装上注明A、B、C或D的营养等级标签&#xff0c;列明饮料含糖分和饱和脂肪的百分比&#xff0c;营养等级为D的饮品则会被禁止做广告营销。…

Tinymce富文本编辑器在vue项目中的使用;引入第三方插件和上传视频、图片等

先放张效果图第一步&#xff1a;安装依赖 npm install tinymce5.0.12第二步&#xff1a;在项目中的public文件夹中新建tinymce文件夹&#xff08;因为我的项目是脚手架创建的&#xff0c;所以公共文件夹是public&#xff09;&#xff1b;在node_modules中找到skins文件夹复制到…

插件化换肤原理—— 布局加载过程、View创建流程、Resources 浅析

作者&#xff1a;孙先森Blog 本文主要分析了 Android 布局加载流程 分析 一般的换肤功能大概是这样的&#xff1a;在 App 的皮肤商城内下载“皮肤包”&#xff0c;下载完成后点击更换界面上的 View 相关资源&#xff08;颜色、样式、图片、背景等&#xff09;发生改变&#xf…

栈的实现及相关OJ题

&#x1f389;&#x1f389;&#x1f389;点进来你就是我的人了 博主主页&#xff1a;&#x1f648;&#x1f648;&#x1f648;戳一戳,欢迎大佬指点!人生格言&#xff1a;当你的才华撑不起你的野心的时候,你就应该静下心来学习! 欢迎志同道合的朋友一起加油喔&#x1f9be;&am…

28岁,他是如何成为上市公司测试总监的

现在的大环境下&#xff0c;各行各业都开始内卷起来&#xff0c;测试也不例外&#xff0c;企业要求也越来越高&#xff0c;“会代码”逐渐成为测试工程师的一个标签。你要想拿到一个不错的薪资&#xff0c;必不可少的一个技能—自动化测试&#xff0c;自动化测试难吗&#xff1…