https://www.jianshu.com/p/c56ea43b2b34
编辑器之间的竞争一直也十分的激烈,用过Webstom,Hbuilder,之前sublime也被我折腾的写代码十分舒服,然而当出现了几乎所有使用过的人都发出好评的VScode的时候必然还是想去试试,用完几个月之后,着实真心感觉到了微软这波诚意也是到位了,"真的舒服"是我唯一能表达的感受,所以就从个人的角度出发对vscode的使用做一个小结,本文类似一个记录板,快捷键和代码块简写确实用熟练了能提高我们写代码的速度,所以本文会从这些可以以记得东西出发,到我所使用的插件的推荐,再到代码块的简写记录来表达我对这款编辑器的好评,也当做一个不熟练的笔记本吧。
基础的到处使用类似于ctr+c是复制这种“客套话”就不说了....以下快捷键组合都是以MAC为例,不过带cmd键的你只要换成ctr在Win上也都是好使的。当然这些都是默认的快捷键,你自己改掉了一些快捷键不能说我赖皮。
cmd+shift+?系列| 快捷键 | 功能 | 
|---|---|
| cmd+shift+D | 打开Debugger | 
| cmd+shift+K | 删除光标所在的一整行 | 
| cmd+shift+L | 选择当前文件中所有你当前选中的词汇 | 
| cmd+shift+F | 打开全局搜索 | 
| cmd+shift+M | 打开你的问题面板 | 
| cmd+shift+H | 对当前文件的查询替换 | 
| cmd+shift+S | 文件另存为 | 
| cmd+shift+T | 打开最近关闭的那个文件 | 
| cmd+shift+X | 打开安装插件的入口 | 
| cmd+shift+V | 预览MarkDown | 
| cmd+shift+空格 | 参数提示 | 
| cmd+shift+\ | 光标跳转到花括号闭合处 | 
cmd+?系列| 快捷键 | 功能 | 
|---|---|
| cmd+B | 打开或者关闭侧边栏 | 
| cmd+W | 关闭当前窗口 | 
| cmd+P | 打开最近关闭的文件 | 
| cmd+]/[ | 左右控制行缩进 | 
| cmd+/ | 注释一行或取消当前行的注释 | 
| cmd+F | 查询在当前文件 | 
| cmd+, | 打开用户设置 | 
| cmd+N | 新建一个文件 | 
| cmd+O | 打开一个文件 | 
| ctr+` | 打开集成的终端 | 
cmd+K ?系列在Vscode中的cmd+k我觉得像是vim中的退出到命令执行模式,他会等待你继续按下下面的命令,你也可以认为一系列的cmd+k系的都是组合件

所以接下来就是cmd+k系列的快捷键了
| 快捷键 | 功能 | 
|---|---|
| cmd+k cmd+s | 打开快捷键设置(其实每个人的操作习惯不同,在此你可以自定义你的键组合) | 
| cmd+k U | 关闭工作区中没有更改的编辑窗口 | 
| cmd+k Z | 进入zen模式,就是删除所有其他让人分心的元素,安心写代码的模式 | 
| cmd+k R | 在mac中是在文件系统(Finder)中显示你正在编辑的文件 | 
| cmd+k P | 复制当前文件的绝对路径 | 
其余的我不常用的就不列举了,可以在快件键设置中查找或者自定义你的指法:)
插件推荐应该说明情况,由于本人的主要代码是Javascript(Node,ES6,ES5)和Python,主要框架为Vue,Express,也开始渐渐的直接在在Vscode中写Markdown了(之前使用MacDown其实也很舒服)。所以插件在于慢慢发现是和合适自己需求的,自己觉得舒服的。那么作为我的推荐以及我自己所使用的也会根据我自己的场景进行。
JavaScript
Node
Python
Vue
其他小工具
MarkDown
主题
| 简写 | 生成 | 
|---|---|
imp | 
会生成import moduleName from ‘modulename‘ | 
imn | 
直接引入不加模块名import module | 
imd | 
导入模块的一部分import { } from ‘module‘; | 
ime | 
导入模块的所有内容并且进行重命名import * as alias from ‘module‘; | 
ima | 
导入部分并重命名import { originalName as alias } from ‘module‘ | 
enf | 
使用export导出一个方法export const functionName = (params) => {}; | 
edf | 
使用export default 到处一个默认方法export default (params) => {}; | 
ecl | 
使用export defauly导出一个默认类export default class className {}; | 
ece | 
使用export defauly导出一个默认继承基类的类export default class className extends baseclassName {} | 
con | 
类中的构造函数constructor(params) {} | 
met | 
类中的方法methodName(params) {} | 
pge | 
类属性的get方法get propertyName() {return this.;} | 
pse | 
类属性中的set方法set propertyName(value) {;} | 
prom | 
返回一个promise对象return new Promise((resolve, reject) => {}); | 
anfn | 
生成一个标准箭头函数(params) => {} | 
dar | 
数组解构const [propertyName] = arrayToDestruct; | 
clg | 
console.log | 
| 简写 | 生成 | 
|---|---|
ae | 
增添监听器document.addEventListener(‘load‘, function (e) {}); | 
cel | 
创建一个dom对象document.createElement(elem); | 
gi | 
document.getElementById(‘id‘); | 
gc | 
document.getElementsByClassName(‘class‘); | 
gt | 
document.getElementsByTagName(‘tag‘); | 
ih | 
document.innerHTML = ‘elem‘; | 
afn | 
function声明的匿名函数,正好补充了上面插件的anfn箭头函数 | 
fn | 
具名函数function methodName (arguments) {} | 
jp | 
JSON.parse(obj); | 
js | 
JSON.stringify(obj); | 
iife | 
立即执行函数 | 
好就在vue是单独一套的语法结构所以在使用vue的时候基本上你敲入vue三个字母的时候你想要的就已经看到了,不用特殊的记忆

原文:https://www.cnblogs.com/qinlongqiang/p/11640732.html