
vscode插件开发(一)hello world
写了四个月的vscode插件,中间踩了太多的坑,有很多心得想与大家分享,接下来打算一周写一篇文章来介绍一下vscode插件开发。今天这第一篇当然就是hello world了。
一恍又大半年没更新了,再不更新大家或许就会忘记我了吧。
最近四个月一直在开发一款vscode插件,目前已经开发完毕了,是一款测试脚本IDE插件,能够实现测试脚本的编写管理调试等功能。
界面如下:
这个IDE插件是配合我写的嵌入式linux ui自动化测试核心来用的。整套工具应该是目前嵌入式linux上最强大的ui自动化测试工具了。大家如果感兴趣可以私聊我。
现在回到标题,写了四个月的vscode插件,中间踩了太多的坑,有很多心得想与大家分享,接下来打算一周写一篇文章来介绍一下vscode插件开发。今天这第一篇当然就是hello world了。
vscode插件的开发还是很好上手的。微软官方的文档写得非常详细:https://code.visualstudio.com/api
只要按照教程一步一步走就可以了。https://code.visualstudio.com/api/get-started/your-first-extension
首先当然是要下好vscode,一般在官网下最新的版本就可以了。如果有特别的需求比如要支持win7的话,那就只能用v1.70.3及以下版本了,再高的版本不支持win7了。
接下来是下好git(https://git-scm.com/)和node(https://nodejs.org/en/),node用最新的LTS版就可以了。
装好必要的软件后就可以开始开发了。
按照vscode的教程,第一步是安装项目生成器,通过它可以一键生成一个vscode插件项目,并提供好基本的项目框架。
npm install -g yo generator-code
安装好后就可以敲yo code
来创建项目了。它会问你插件所用的语言、名字、标识符、描述、创不创建git仓库、用什么包管理器等问题,这个根据自己的需要填写就好,我的建议是语言用ts、包管理器用npm。
1、插件的类型,vscode的插件分为好多种,见名知意分为扩展、主题、语言、代码片段、键盘映射、扩展包、网络扩展、笔记本渲染等,最主要的就是扩展了。
项目创建好之后,用vscode打开刚建好的那个项目文件夹,之后就可以点击调试按钮或者按F5来调试插件了。
开启调试后会新开一个vscode的窗口,它会作为插件的宿主,原来的窗口会进入调试模式,可以在调试窗口中设置断点查看打印输出。
宿主窗口:
原窗口:
通过项目生成器生成的项目本身是一个可以运行的项目。在插件宿主中打开命令面板,输入Hello World
就会激活插件,它会在右下方弹出一个提示框显示【hello world】的字样。
打开命令面板:
输入 hello world:
右下方弹出提示信息,说明插件激活成功了!
在原来的vscode窗口中的调试控制台中可以看到console.log输出的信息:
这就是一个最简单的vscode插件。
更多推荐
所有评论(0)