发布一个自己亲手调出来的代码主题,本来想着跟发个npm包一样顺手就能搞定,结果发现完全不是那么回事。Visual Studio Marketplace和Open VSX这两个地方得分别折腾,中间还卡在Azure DevOps的账号认证上,各种报错让人抓狂。这里把亲手试出来的两条发布路线掰开揉碎讲清楚,从准备包到最终让主题出现在插件市场,每一步都带上避坑经验。
主题发布前的准备
在开始打包之前,package.json这个文件就是整个主题的身份证,里面几个字段要是填不对,后面所有操作都白搭。主题的名字不能带scope,比如@someone/awesome-theme这种写法在Open VSX那边会直接被拒收,老老实实写成awesome-theme就行。为了让主题在市场上看起来更显眼,可以准备一张128×128像素的方形图标,在package.json里用icon字段指向这张图片的路径,这样插件列表里就能看到专属标识了。
{
"name": "twilight-cosmos-theme",
"icon": "images/icon.png",
"contributes": {
"themes": [
{
"label": "Twilight Cosmos",
"uiTheme": "vs-dark",
"path": "./themes/twilight-cosmos-color-theme.json"
}
]
},
"keywords": [
"theme",
"dark theme",
"twilight",
"cosmos",
"color-theme",
"dark",
"purple",
"blue"
]
}contributes这个字段是编辑器识别主题的关键入口,uiTheme决定了主题属于亮色还是暗色系,vs-dark代表暗色主题,vs是亮色。label则是用户在切换主题时看到的名称,可以起得稍微有辨识度一点。关键词这块尽量多塞几个跟颜色、风格相关的词,这样别人搜“紫色主题”或者“暗色主题”的时候能更容易翻到。
发布到Visual Studio Marketplace
微软官方的插件市场走的是vsce这套工具,但前提得有个Azure DevOps账号,然后从里面生成个人访问令牌。这里遇到过页面一直转圈、找不到生成入口的情况,后来发现放一两天再登就好了,也不知道是服务器抽风还是账号同步有延迟。令牌生成的时候有效期最多只能选一年,不像npm token那样能永久有效,这一点得记着到期前续一下。
有了令牌之后,先通过命令行登录,登录用的ID是发布者ID,不是账号的显示名称。
npx vsce login your-publisher-id执行完会提示输入令牌,把之前生成的那一串贴进去就行。登录成功后直接运行发布命令,工具会自动打包并上传到Visual Studio Marketplace。
npx vsce publish如果走命令行这条路卡住了,比如Azure DevOps怎么都登不上,还有另一条手动上传的路可以走。先执行打包命令,生成一个.vsix文件。
npx vsce package接着打开Visual Studio Marketplace的网页,找到发布扩展的入口,点新建扩展,然后把刚才生成的.vsix文件直接拖拽到上传区域,等进度条走完就完事了。这两条路不管走哪条,新发布的主题大概需要几分钟才能在商店里搜到。
发布到Open VSX
很多基于VS Code的编辑器,像Cursor这类,用的其实是Open VSX这个市场。往这里发布主题比微软市场多几个步骤,但好在访问令牌可以长期有效,不用每年折腾一次。首先得用GitHub账号登录Open VSX网站,然后关联Eclipse Foundation的账号,在网站上找到创建发布者命名空间的入口。
创建命名空间的时候填的ID就是后面package.json里要用的publisher字段值。这一步完成之后,在项目根目录下运行npx ovsx publish,第一次执行会提示输入令牌,这个令牌在Open VSX网站的账号设置里生成,复制粘贴过去就能发布成功。
npx ovsx publish| 步骤 | 操作说明 | 耗时预估 |
|---|---|---|
| 登录 | GitHub授权登录Open VSX | 1分钟 |
| 关联 | 绑定Eclipse Foundation账号 | 2分钟 |
| 创建 | 新建发布者命名空间 | 1分钟 |
| 发布 | 执行ovsx发布命令 | 30秒 |
让主题能被更多人搜到
主题发布之后,在README.md里放几张截图很有必要,别人点进详情页第一眼就能看到配色长啥样。但这两个市场都不支持相对路径,直接写./screenshot.png会显示裂图。最稳的办法是把图片推到GitHub仓库,然后用raw的绝对链接。
如果想在Visual Studio Marketplace拿到那个“已验证”的小勾勾,得等主题发布满六个月之后才能申请。Open VSX这边倒是没有硬性等这么久,但需要去Eclipse Foundation提个GitHub issue,说明想认领这个命名空间,附上仓库地址,那边审核通过之后就能拿掉那个未认领的警告标志。
