一、前言+ t# H# h" {$ y, {- b
本文为vscode插件——code snippets开发的踩坑笔记,旨在提供一个快捷有效的方式打造一款自己的vscode插件。上手不难,但是就是坑比较多,为了避免更多人踩坑,于是写文避坑。本文针对新手,楼主也是花了半天时间上手去踩坑的。文末有github仓库地址,码友们可以直接clone下来当作以后code snippets插件的模板。 ^ n- l* B7 o" n8 Q& J/ I 二、环境准备1 A+ C h( w9 }
node
npm
yeoman sudo npm i yo -g
gernerator-code sudo npm i gernerator-code -g- V5 ]+ l5 N: i0 z* J4 u$ v" U
三、开发者账号申请6 u3 V4 f' S5 p7 A" J; K
点击 Visual Studio Team Services,点击最上方立即注册,注册自己的账号,可以用GitHub账号直接登录。) f7 M: X' n: R7 Z
1.注册并登录 Azure DevOps。 3 X6 v! ]! h7 O: D r2.选择或者创建一个组织(new organization)。- G8 S P1 _( K; a
3.在该组织下创建一个项目(new project)。5 t& c8 U- n# r/ H; e
以上三步都是为了获取开发者(publisher)的token,获取token如下图: + ]1 m3 n7 X6 g$ q$ |1 C3 h
8 f% f( E/ R* o, T. I( f
4. 点击 New Token,注意这里创建token一定要下拉选择 all accessible organizations,然后点击右下角的 Show all scopes 找到 Marketplace 选择 Manage。7 C! e! Z. D1 I' J ; f# a: N0 N5 I1 i. ^5. 注册vscode插件开发者(publisher):点击此处。注册保证name和id一致,并且只需要填写这两个就可以了。* P* C. d: t* j6 [ 三、项目搭建6 m) D, K6 S1 m
1、项目初始化3 v9 j1 B6 X0 f1 D7 V% ?, O& C" y
终端输入 yo code。
选项如下设置:language选择javascript,名称就是你扩展的名称。 $ g2 r2 x# j8 ?8 y I7 l
8 h* c, }! f9 C
2、项目改造 2 D! H4 Q" P% P' ?/ X8 e& J% b 将项目文件夹yc-charts-code-snippets(你的扩展名字的文件夹)拖到vscode中打开。做以下改造:& a9 S. Q L* o2 J `" u' Z: e6 D0 i
1.将package.json改造成以下模样:6 `; G M \8 x. ~5 l8 v. c