似乎是从chrome开始，插件不叫插件了，改名叫扩展。vscode也不例外。今天尝试写一个vscode的插件，好吧，是扩展。
按照官网(github上有一个翻译项目CN-VScode-Docs还没翻完，有兴趣可以一起翻)的指导，第一步要先通过npm安装Yeoman。如下所示：
$ npm install -g yo generator -code
npm WARN deprecated nomnom@1.6.2: Package no longer supported. Contact support@npmjs.com for more info.
npm WARN deprecated minimatch@0.2.14: Please update to minimatch 3.0.2 or higher to avoid a RegExp DoS issue
npm WARN checkPermissions Missing write access to /usr/local/lib/node_modules
npm ERR! path /usr/local/lib/node_modules
npm ERR! code EACCES
npm ERR! errno -13
npm ERR! syscall access
npm ERR! Error: EACCES: permission denied, access '/usr/local/lib/node_modules'
npm ERR! { Error: EACCES: permission denied, access '/usr/local/lib/node_modules'
npm ERR! stack: 'Error: EACCES: permission denied, access \'/usr/local/lib/node_modules\'',
npm ERR! errno: -13,
npm ERR! code: 'EACCES',
npm ERR! syscall: 'access',
npm ERR! path: '/usr/local/lib/node_modules' }
npm ERR!
npm ERR! Please try running this command again as root/Administrator.
╭─────────────────────────────────────╮
│ │
│ Update available 5.4.2 → 6.2.0 │
│ Run npm i -g npm to update │
│ │
╰─────────────────────────────────────╯
npm ERR! A complete log of this run can be found in:
npm ERR! /Users/xxx/.npm/_logs/2018-09-09T14_40_04_435Z-debug.log
还得先更新npm
$ npm i -g npm
npm ERR! path /usr/local/lib/node_modules/npm/node_modules/abbrev
npm ERR! code EACCES
npm ERR! errno -13
npm ERR! syscall access
npm ERR! Error: EACCES: permission denied, access '/usr/local/lib/node_modules/npm/node_modules/abbrev'
npm ERR! { Error: EACCES: permission denied, access '/usr/local/lib/node_modules/npm/node_modules/abbrev'
npm ERR! stack: 'Error: EACCES: permission denied, access \'/usr/local/lib/node_modules/npm/node_modules/abbrev\'',
npm ERR! errno: -13,
npm ERR! code: 'EACCES',
npm ERR! syscall: 'access',
npm ERR! path: '/usr/local/lib/node_modules/npm/node_modules/abbrev' }
npm ERR!
npm ERR! Please try running this command again as root/Administrator.
又失败了，提示权限不够，打开不了/usr/local/lib/node_modules/npm/node_modules/abbrev。于是，用sudo来执行
$ sudo npm i -g npm
Password:
/usr/local/bin/npx -> /usr/local/lib/node_modules/npm/bin/npx-cli.js
/usr/local/bin/npm -> /usr/local/lib/node_modules/npm/bin/npm-cli.js
+ npm@6.4.1
added 283 packages, removed 306 packages and updated 41 packages in 35.995s
再次安装Yeoman，又失败，提示usr/local/lib/node_modules又没权限。于是，又用sudo搞定
$ sudo npm install -g yo generator -code
Password:
npm WARN deprecated nomnom@1.6.2: Package no longer supported. Contact support@npmjs.com for more info.
npm WARN deprecated minimatch@0.2.14: Please update to minimatch 3.0.2 or higher to avoid a RegExp DoS issue
/usr/local/bin/generate -> /usr/local/lib/node_modules/generator/bin/index.js
/usr/local/bin/generator -> /usr/local/lib/node_modules/generator/bin/index.js
/usr/local/bin/yo -> /usr/local/lib/node_modules/yo/lib/cli.js
/usr/local/bin/yo-complete -> /usr/local/lib/node_modules/yo/lib/completion/index.js
> spawn-sync@1.0.15 postinstall /usr/local/lib/node_modules/yo/node_modules/spawn-sync
> node postinstall
> yo@2.0.5 postinstall /usr/local/lib/node_modules/yo
> yodoctor
Yeoman Doctor
Running sanity checks on your system
✔ Global configuration file is valid
✔ NODE_PATH matches the npm root
✔ Node.js version
✔ No .bowerrc file in home directory
✔ No .yo-rc.json file in home directory
✔ npm version
✔ yo version
Everything looks all right!
+ yo@2.0.5
+ generator@1.0.1
added 572 packages from 279 contributors in 72.323s
顺便说下，上面的命令写错了，generator -code中间不能有空格。。。
正确的命令如下所示：
$ sudo npm install -g yo generator-code
Password:
⸨ ░░░░░░░░░░░░░░░░⸩ ⠼ loadDep:signal-exit: sill resolveWithNewModule camelcase@2.1.1 checking installable status
⸨ ░░░░░░░░░░░░░░░░⸩ ⠼ loadDep:signal-exit: sill resolveWithNewModule camelcase@2.1.1 checking installable status
/usr/local/bin/yo -> /usr/local/lib/node_modules/yo/lib/cli.js
/usr/local/bin/yo-complete -> /usr/local/lib/node_modules/yo/lib/completion/index.js
> yo@2.0.5 postinstall /usr/local/lib/node_modules/yo
> yodoctor
Yeoman Doctor
Running sanity checks on your system
✔ Global configuration file is valid
✔ NODE_PATH matches the npm root
✔ Node.js version
✔ No .bowerrc file in home directory
✔ No .yo-rc.json file in home directory
✔ npm version
✔ yo version
Everything looks all right!
+ yo@2.0.5
+ generator-code@1.1.37
added 374 packages from 279 contributors and updated 1 package in 529.683s
搞定后，第二步是生成扩展的框架代码，跟官网的例子不同的是，我选择的是js，而不是ts。
$ yo code
_-----_ ╭──────────────────────────╮
| | │ Welcome to the Visual │
|--(o)--| │ Studio Code Extension │
`---------´ │ generator! │
( _´U`_ ) ╰──────────────────────────╯
/___A___\ /
| ~ |
__'.___.'__
´ ` |° ´ Y `
? What type of extension do you want to create? New Extension (JavaScript)
? What's the name of your extension? newbie
? What's the identifier of your extension? newbie
? What's the description of your extension?
? What's your publisher name (more info: https://code.visualstudio.com/docs/tools/vscecli#_publishing-extensions)? tintinr
? Enable JavaScript type checking in 'jsconfig.json'? Yes
? Initialize a git repository? Yes
完整代码见github项目，下一篇再来分析下js的扩展代码。
网友评论