更多文章请戳VSCode插件开发全攻略系列目录导航. 代码片段 代码片段,也叫snippets,相信大家都不陌生,就是输入一个很简单的单词然后一回车带出来很多代码.平时大家也可以直接在vscode中创建属于自己的snippets: 创建代码片段 那么如何在扩展中创建snippets呢? package.json文件新增如下: "contributes": { "snippets": [ { // 代码片段作用于那种语言 "language": &…

文章索引 VSCode插件开发全攻略(一)概览 VSCode插件开发全攻略(二)HelloWord VSCode插件开发全攻略(三)package.json详解 VSCode插件开发全攻略(四)命令.菜单.快捷键 VSCode插件开发全攻略(五)跳转到定义.自动补全.悬停提示 VSCode插件开发全攻略(六)开发调试技巧 VSCode插件开发全攻略(七)WebView VSCode插件开发全攻略(八)代码片段.设置.自定义欢迎页 VSCode插件开发全攻略(九)常用API总结 VSCode插件开…

更多文章请戳VSCode插件开发全攻略系列目录导航. package.json 在详细介绍vscode插件开发细节之前,这里我们先详细介绍一下vscode插件的package.json写法,但是建议先只需要随便看一下,了解个大概,等后面讲到具体细节的时候再回过头来看. 如下是package.json文件的常用配置,当然这里还不是全部: { // 插件的名字,应全部小写,不能有空格 "name": "vscode-plugin-demo", // 插件的友好显示名称,…

更多文章请戳VSCode插件开发全攻略系列目录导航. 发布方式 插件开发完了,如何发布出去分享给他人呢?主要有3种方法: 方法一:直接把文件夹发给别人,让别人找到vscode的插件存放目录并放进去,然后重启vscode,一般不推荐: 方法二:打包成vsix插件,然后发送给别人安装,如果你的插件涉及机密不方便发布到应用市场,可以尝试采用这种方式: 方法三:注册开发者账号,发布到官网应用市场,这个发布和npm一样是不需要审核的. 本地打包 无论是本地打包还是发布到应用市场都需要借助vsce这个工具.…

更多文章请戳VSCode插件开发全攻略系列目录导航. 什么是Webview 大家都知道,整个VSCode编辑器就是一张大的网页,其实,我们还可以在Visual Studio Code中创建完全自定义的.可以间接和nodejs通信的特殊网页(通过一个acquireVsCodeApi特殊方法),这个网页就叫WebView.内置的Markdown的预览就是使用WebView实现的.使用Webview可以构建复杂的.支持本地文件操作的用户界面. VSCode插件的WebView类似于iframe的实现,…

更多文章请戳VSCode插件开发全攻略系列目录导航. 前言 在介绍完一些比较简单的内容点之后,我觉得有必要先和大家介绍一些开发中遇到的一些细节问题以及技巧,特别是后面一章节将要介绍WebView的知识,这个坑会比较多,避免大家走弯路. 开发方式 最理想的方式是准备双显示器,一个写代码,一个运行插件,实践证明这种方式开发效率会提升很多,每次修改完代码之后直接Ctrl+R重新加载即可,非常方便. 日志查看 就我目前遇到的情况来看,vscode日志主要有这5种: 旧窗口的调试控制台 扩展里的conso…

更多文章请戳VSCode插件开发全攻略系列目录导航. 跳转到定义 跳转到定义其实很简单,通过vscode.languages.registerDefinitionProvider注册一个provider,这个provider如果返回了new vscode.Location()就表示当前光标所在单词支持跳转,并且跳转到对应location. 为了示例更加有意义,我在这里写了一个支持package.json中dependencies.devDependencies跳转到对应依赖包的例子jump-to…

更多文章请戳VSCode插件开发全攻略系列目录导航. 命令 我们在前面HelloWord章节中已经提到了命令写法,这里再重温一下. context.subscriptions.push(vscode.commands.registerCommand('extension.sayHello', () => { vscode.window.showInformationMessage('您执行了extension.sayHello命令!'); })); 然后在清单文件声明: "commands…

更多文章请戳VSCode插件开发全攻略系列目录导航. 写着前面 学习一门新的语言或者生态首先肯定是从HelloWord开始. 您可以直接克隆我放在GitHub上vscode-plugin-demo 的代码到本地,然后尝试修改代码并运行,也可以使用微软官方的脚手架vscode-generator-code来生成项目结构,脚手架的使用我们后面再来介绍,先来熟悉一下项目结构. HelloWorld 项目结构 项目结构其实很简单,主要是清单文件package.json以及extension.js这个插件…

更多文章请戳VSCode插件开发全攻略系列目录导航. 本文提炼一些常见的API使用场景供参考,本文内容有待完善. 编辑器相关 修改当前激活编辑器内容 替换当前编辑器全部内容: vscode.window.activeTextEditor.edit(editBuilder => { // 从开始到结束,全量替换 const end = new vscode.Position(vscode.window.activeTextEditor.document.lineCount + 1, 0); con…