vscode常用插件及快捷键整理
常用插件:
- Chinese:中文语言包
- View In Browser:在浏览器里打开
- vscode-icons:让vscode资源目录加上图标
- Auto Rename Tag:修改html标签,自动帮你完成尾部闭合标签的同步修改
- Auto Close Tag:自动闭合HTML/XML标签
- cssrem:将px转为rem,在左下角点设置,搜索cssrem,设置对应参数
- Vetur:vue插件
- Bracket Pair Colorizer:给括号加上不同的颜色
- Beautify:格式化代码(在工作目录下建立.jsbeautifyrc文件),代码如下,可以根据自己的需求修改相应参数,格式化代码快捷键:alt + shift + k
代码
{
"brace_style": "none,preserve-inline",
"indent_size": 4,
"indent_char": " ",
"jslint_happy": true,
"unformatted": [""],
"css": {
"indent_size": 2
}
}
- Debugger for Chrome:映射vscode上的断点到chrome上:
详细可以参考我这篇博客 - GitLens:方便查看git日志,git的重度患者使用
- Markdown Preview Enhanced:实时预览markdown
- markdownlint:markdown语法纠错
- React/Redux/react-router Snippets:React/Redux/react-router语法智能提示
常用快捷键:
-
打开命令行 (>):Ctrl + Shift + P
-
查找文件窗口:Ctrl + P
-
删除当前行:Ctrl + Shift + K
-
显示/隐藏侧边栏:Ctrl + B
-
搜索变量或者函数:Ctrl + Shift + O
-
跳转到行数:Ctrl + G
-
代码行缩进:Ctrl + [ , Ctrl + ]
-
代码格式化:Alt + Shift + F
-
上下移动一行:Alt + Up , Alt + Down
-
向上向下复制一行:Alt + Shift + Up , Alt + Shift +Down
-
在当前行下面插入一行:Ctrl + Enter
-
在当前行上面插入一行:Ctrl + Shift + Enter
-
回退到上一个光标:Ctrl + U
-
移动到文件末尾:Ctrl + End
-
移动到文件开头:Ctrl + Hone
-
移动到行首:Home
-
移动到行尾:End
-
同时选中所有匹配:Ctrl + Shift + L
-
删除光标所在行:Ctrl + Shift + K
-
移动到定义处:F12(会跳转)
-
定义处缩略图:Alt + F12(不跳转)
-
找到所有的引用:Shift + F12
-
删除光标右侧的所有字: Ctrl + Delete
-
下一个匹配的也被选中:Ctrl + D
-
打开一个新窗口:Ctrl + Shift + N
-
关闭窗口:Ctrl + Shift + W
-
文件之间切换:Ctrl + Tab
-
查找:Ctrl + F
-
查找替换:Ctrl + H
-
整个文件夹中查找:Ctrl + Shift + F
-
全屏:F11
-
放大/缩小:Ctrl +/-
-
显示资源管理器:Ctrl + Shift + E
-
显示Git:Ctrl + Shift + G
-
显示Debug:Ctrl + Shift + D
-
显示Output:Ctrl + Shift + U
常见操作:
刚clone下来的vue项目会有格式只是空两格:文件–>首选项–>设置,搜索tabsize修改设置
vscode我经常用到的就是这些了,以后还会持续更新…
一辈子很短,努力的做好两件事就好;第一件事是热爱生活,好好的去爱身边的人;第二件事是努力学习,在工作中取得不一样的成绩,实现自己的价值。