vscode插件开发教程,vscode写javascript插件
执行插件内置命令本部分在开发工具插件开发教程-helloworld插件的基础上继续开发。
开发工具内置命令有两种使用方式,一种是在插件里直接调用;还有将命令解析成uri,给用户选择。比如在鼠标盘旋的时候,自动生成一句注释本行?而注释本行?本身可以点击,在点击后该行代码被注释。
直接在程序里执行命令无参命令有一些命令直接执行即可,无需额外参数,也不会返回内容,比如注释语句,下面是使用示例:
首先在科学研究委员会下新建目录命令,新建文件commandExecute.ts,输入下列内容:
从"虚拟代码"中导入*作为vs代码;设executeCommandNoArgs=vs代码。命令。注册命令( hello world。executeCommandNoArgs ,()={ vs代码。命令。执行命令(编辑器。行动。addcommentline’);});导出{ executeCommandNoArgs };这里和编译里面一样,注册了一个新命令,该命令会执行开发工具的内置命令:editor.action.addCommentLine。
在extension.ts里面导入刚才建好的文件从""导入{ executeCommandNoArgs } ./command/command execute ;
在使活动方法里面新增一行语境。订阅。push(executeCommandNoArgs);
在package.json命令列表里面增加一个新命令执行CommandNoArgs,并指定在命令触发时插件激活:
activationEvents: [.你好,世界。executecommandnoargs ], contributes: { commands: [.{ command : hello world。executecommandnoargs , title : executecommandnoargs }]},在新窗口执行开发人员:重新加载窗口来重新加载。
在新窗口里面打开一个新的文件,比如test.py,内容随便写一写,比如:
测试=测试测试1=测试1 光标置于其中一行上,或者全选,执行命令执行CommandNoArgs,可以看到代码已经被注释。
有参/有返回值命令有些命令需要传入参数,或者会返回参数,以 vscode.executeDefinitionProvider 命令为例(该命令是查找当前变量、函数等的定义的位置):
在commandExecute.ts文件中新增如下内容:
设executefinitioncommand=vs代码。命令。注册命令( hello world。executefinitioncommand ,()={ async function printDefinitionsForActiveEditor(){ const active editor=vs code。窗户。活动文本编辑器;如果(!活动编辑器){ return} //执行有参命令vscode.executeDefinitionProvider,并获取其返回值常量定义=等待vs代码。命令。executecommandvscode。位置[]( vs代码。executediationprovider ,activeEditor.document.uri,活动编辑器。选择。主动);如果(定义!==undefined){ for(const definition of definitions){//输出其定义的位置控制台。日志(` o定义的位置在${definition.uri.path}文件的第${definition.range.start.line}行第$ {定义。范围。开始吧。字符}个字符到` `第${definition.range.end.line}行第$ {定义。范围。结束。字符}个字符`);} } } printdefinitionsforactiveeditor();});并在文件最后导出变量executedificoncommand:export { executeCommandNoArgs,executedificoncommand };
在extension.ts里面导入刚才建好的命令从""导入{ executeCommandNoArgs,executeDefinitionCommand } ./command/command execute ;
在使活动方法里面新增增加一行语境。订阅。push(executefinitioncommand);
在package.json命令列表里面增加一个新命令执行定义命令,并指定在命令触发时插件激活:
activationEvents: [.你好,世界。executefinitioncommand ], contributes: { commands: [.{ command : hello world。executedificoncommand , title : executedificoncommand }]},在新窗口执行开发人员:重新加载窗口来重新加载。
编辑test.py并添加一个简单的方法:
test= test test1= test1 def my_func():pass my _ func()将光标放在最后一个my _ func上,执行命令Execute DefinitionCommand。可以在插件开发的控制台中看到这个函数的定义位置:定义位置在/home/xiaochao/study/any-test/test . py的第3个文件中,(这个部分可能需要安装python插件,所以可以用其他任何已经安装了相应插件的语言来做这个测试。)
命令URI有些命令不在插件中直接调用,而是留给用户选择是否执行操作。例如,当鼠标悬停在某些行上时,会自动生成注释行?并评论这一行?你可以自己点击它,点击后那行代码是注释的,所以你需要使用URI命令来生成内容。以下例子来自官方。
添加文件src/command/commandURI.ts,并写入以下内容:
从“vscode”中导入*作为vs code;/* * *为了生成悬停内容,需要自己定义一个悬停提供者*/class我的悬停实现vs code . hover provider { provide hover(document:vs code . text document,_position: vscode。Position,_ token:vs code . cancelation token):vs code . providerresultvscode . hover {//Resolve editor . action . addcommentline成URI //命令方案const commentcommandURI=vscodeuriparse(` command:editor;行动;add commentline `)必须用于所有要解析为URIs的命令;//要生成的悬停内容,这里使用的是markdown文档格式const contents=new vs code . markdownstring(`[add comment]($ { commanduri })`);//要在markdown中执行命令URI,必须设置item contents . is trusted=true;返回新的vscode。悬停(内容);} }导出{ my hover };请参考注释中的解释。写完之后,在extension.ts中引入这个类,在活动方法中添加一个新行:
vs code . languages . registerhoverprovider( python ,new my hover());说明我们是python语言的悬停扩展。
为了让我们的插件显示悬停效果,需要在检测到python语言时将其激活,所以在package.json中增加了新的激活条件:
激活事件:[. on language: python],将其重新加载到新打开的页面中,将鼠标悬停在该语句上,您将看到我们生成的内容Add comment。单击它可以注释掉该行。