使用vscode开发，使用插件记录
一、vscode设置小技巧：1、在vscode中显示空格和tab符号:2、VSCode文本编辑设置代码自动换行：3、vs code设置每行代码的垂直标尺：4、vscode 文件标签栏多行显示：5、vscode设置格式化：6、vscode设置tab空格数及tab转空格：7、保存文件时删除行尾的空格：二、插件记录：1、备份vscode配置：2、注释/缩进/括号高亮/颜色/空格：3、Git代码管理：4、主题/背景/文件图标/中文显示：5、格式化/智能提示/跳转/补全/对齐/错误提示：6、cmake编译器：7、翻译：8、项目管理/历史版本/文件比较：9、共享/远程：10、markdown/程序包/文件路径/变量函数命名：11、添加标签/代码截图/单词检查：12、实时显示代码运行结果/智能提示代码/提示函数参数/格式转换：三、快捷键：1、常用 General2、基础编辑 Basic editing3、导航 Navigation4、搜索和替换 Search and replace5、多光标和选择 Multi-cursor and selection6、丰富的语言编辑 Rich languages editing7、编辑器管理 Editor management8、文件管理 File management9、显示 Display10、调试 Debug11、集成终端 Integrated terminal一、vscode设置小技巧：
1、在vscode中显示空格和tab符号:
1、打开setting设置,在搜索框中输入 renderControlCharacters ,选中勾选框,即可显示tab.2、打开setting设置,在搜索框中输入 renderWhitespace ,选择all,即可显示空格.
2、VSCode文本编辑设置代码自动换行：
1、打开setting设置,在搜索框中输入：editor.wordWrap ，将状态修改为on即可。
3、vs code设置每行代码的垂直标尺：
1、文件－>设置－>首选项－>搜索‘editor.rulers’－>点击’settings.ison’2、然后在 "editor.rulers": []代码行中的中括号里，填你想在多少个字符后设置标尺即可显示垂直标尺。3、数值说明：//按照列表里的数值，在相应字符后显示垂直标尺。//列表里可以输入多个值，显示多个标尺，若列表为空，则不绘制标尺。
4、vscode 文件标签栏多行显示：
1、打开setting设置,在搜索框中输入 workbench.editor.wrapTabs ，勾选该设置项即可。或者：1、按住 ctrl + shift + p 。2、输入 open workspace settings,选择打开工作区设置。3、输入 workbench.editor.wrapTabs ，勾选该设置项即可。
5、vscode设置格式化：
1、打开setting设置,在搜索框中输入 format on save，Editor:Format On Paste控制编辑器是否自动格式化粘贴的内容。Editor:Format On Save在保存时格式化文件。Editor:Format On Save Mode控制在保存时设置格式是设置整个文件格式还是仅设置修改内容的格式。Editor:Format On Type控制编辑器在键入一行后是否自动格式化该行。
6、vscode设置tab空格数及tab转空格：
1、打开setting设置,在搜索框中输入 Editor:tab size ,输入想要的空格数即可。2、打开setting设置,在搜索框中输入 Editor:insertSpaces ,勾选该设置，按下tab键时插入空格。
7、保存文件时删除行尾的空格：
1、打开setting设置,在搜索框中输入Files:Trim Trailing Whitespace，勾选该设置，启用后，将在保存文件时删除行尾的空格。
二、插件记录：
1、备份vscode配置：
Settings Sync如果要在不同的电脑上使用 vscode 配置是件比较麻烦的事情，使用 Settings Sync 将 vscode 配置备份起来，当需要在其他电脑使用 vscode 时只需下载备份的配置就可以了。只需要一个 GitHub 帐户，并且每次要保存配置（包括按键绑定，代码片段，扩展名等）时，只需按SHIFT + ALT + U将私有设置上传到 GitHub 帐户即可。然后，下次登录或重新格式化为另一台计算机时，可以按SHIFT + ALT + D组合键立即下载配置。
2、注释/缩进/括号高亮/颜色/空格：
Doxygen Documentation Generator可以方便地生成规范的注释。当在文件头部输入 “/**” 后回车,自动生成模板文件注释。在函数上面 “/**” 后回车,自动生成模板函数注释。Better Comments更加人性化的注释，可以通过引入彩色注释使注释更加明显。可以根据告警、查询、TODO、高亮等标记对注释进行不同的展示。此外，还可以对注释掉的代码进行样式设置。您想要的任何其他注释样式都可以在设置中指定。Project Snippets 代码片段，允许你创建自己的代码段，以便在整个项目中重用。使咱们可以创建声明自己的项目/工作区级别的代码段，让当前项目代码段不会与其它项目冲突也不会污染其他项目。indent-rainbow会给缩进添加一种颜色,用五颜六色的色块来对代码的缩进做区分的，让你更加直观的看到代码层次。Indenticator缩进部分白线,当你点击一个缩进部分的时候，会出现一条白线来告诉你当前处于的缩进层级，可以更方便的查看代码结构。(尽量不要与类似插件同时用，否则效果可能不明显)Bracket Pair Colorizer括号高亮，标签匹配 括号匹配插件。可以给()、[]、{}这些常用括号显示不同颜色，当点击对应括号时能够用线段直接链接到一起，让层次结构一目了然。除此之外，它还支持用户自定义符号。Rainbow Brackets方括号 圆括号 大括号 提供彩虹色Color Highlight可以在代码中突出显示颜色，代码中的颜色进行高亮展示。Color Picker是一个 VSCode 扩展，它为咱们提供了一个图形用户界面，用来选择和生成颜色代码，如 CSS 颜色符号。Color Info查看颜色详细信息，查看颜色详细信息的插件，可以小窗口显示颜色值，rgb,hsl,cmyk,hex等等，可以在配置项里添加要展示的信息类型。Trailing Spaces把尾随空格显示出来。
3、Git代码管理：
Git History 显示提交历史记录的美丽图表等等，选择任何一个文件或者文件夹，鼠标右键就可以看到Git: View File History 标签了。GitLens — Git supercharged 可以增强 VSCode 内置 Git 的功能。效果是你鼠标点击哪一行代码，后面都会提示who, when,do what,鼠标悬浮提示上回显示作者，版本，时间，点击作者直接可以发邮件，非常方便。GitHub Pull Requests and Issues可以使得开发者在 Visual Studio Code 轻松 review 和管理 GitHub pull requests，功能包括：在 VS Code 认证并连接到 GitHub 账号在 VS Code 中，列出当前 GitHub repo 的所有 pull requests在 VS Code 中，review GitHub pull requests，进行文件比较，添加 comments在 VS Code 中，轻松 checkout 当前正在 review 的 pull requests，从而可以利用 VS Code 强大的 Go to Definitions、Find All References、IntelliSense 等功能来验证 pull requests。Git Graph可以实现操作的GUI化，非常方便。
4、主题/背景/文件图标/中文显示：
Community Material Theme插件主要是改变背景颜色、代码高亮和字体。Material Theme换各类暗色主题Material Icon Theme与其他图标主题相比，文件类型更为明显，尤其是在使用深色主题。Material Theme Icons替换默认 VSCode 图标的绝佳选择。设计的大型图标目录与主题融为一体，使其更加美观，这有助于你在资源管理器中轻松找到你的文件。vscode-icons图标插件可以使得文件结构更加清晰。自定义图标，自动检测项目，自定义配置。它不仅能够给文件夹、文件添加上舒适的图标，而且可以自动检测项目，根据项目不同功能配上不同图标，例如，git、Markdown、配置项、工具类等等。VSCode Great Icons更改文件图标Chinese (Simplified) (简体中文) 使用中文配置必选Chinese插件
5、格式化/智能提示/跳转/补全/对齐/错误提示：
Prettier - Code formatter 插件，保存时自动格式化代码。Beautify保存格式化ESLint保存格式化Visual Studio IntelliCode能帮助开发人员生成智能代码补全提示，并且它内置支持很多种编程语言。C/C++可以使得C++的编写变得更加容易。必备的插件，如果不安装，代码无法跳转，也没有自动补全。C++ Intellisense跳转到定义；代码自动补全；查找代码引用；列举 symbols；C/C++ Extension PackC/C++ RunnerC/C++ ThemesCode Runner运行与调试功能Better Align对齐赋值符号和注释。要使用它，将光标放在想要对齐的代码中，使用CTRL + SHIFT + P打开命令面板(或者使用自定义快捷方式打开命令面板)，然后调用Align 命令。Error Gutters报错红波浪线提示，报错的地方都有大红波浪线提示，可以说是非常的直观了。Error Lens 通过使诊断更加突出来增强语言诊断功能，在语言生成诊断的任何位置突出显示整行，并内联打印消息。
6、cmake编译器：
cmake功能使得CMakeLists.txt的书写变得容易，具有自动补全和高亮功能。CMake Tools这个Cmake插件是对前一个的插件扩展，主要是cmake命令的支持方面，前一个插件是cmake脚本语言的支持
7、翻译：
翻译(英汉词典)字典翻译#，悬停显示翻译结果，选中英文单词 → 右下角显示中文Code Translate是一款纯粹的滑词翻译软件Comment Translate选中自动翻译，很简单。在下部状态栏可以选自动翻译后的语言。这款插件还配有自动翻译功能，但不是特别灵敏好用，按 Ctrl + Shift + P 输入 translate 选择翻译选区即可。Google Translate选中汉字翻译英文、选中英文翻译汉字，快捷键 Ctrl + Shift + Tvar-translate写变量名或者函数名先打中文，Ctrl + shift + ← 选中后按快捷键翻译为英文。快捷键 Alt + Shift + T
8、项目管理/历史版本/文件比较：
Dependency Analytics分析项目中npm模块依赖，给出了很直观的数据反馈Jupyter是一个开源项目，让您轻松地将Markdown文本和可执行的Python源代码组合在一名为Notebooks的画布上。local history修改代码之后想找回历史代码，安装这款插件之后在侧边栏会出现LOCAL HISTORY的字样，每当我们保存更改时，它都会备份一份历史文件，当我们需要恢复之前版本时，只需要点击一下对应的文件即可。此外，它还会在编辑框显示对比详情，能够让你对修改位置一目了然。装完以后，项目根目录下会自动生成 .history 的文件夹。代码的修改记录就会放在这里面。记得添加.gitignore，不然每次提交代码的时候就要遭重了。Partial Diff文件比较是一种即常用有实用的一项功能，例如，我们想查看哪里修改了代码、查看输出的日志信息有什么区别等等，选中一代码，右键Select Text for Compare，选中另外一部分代码，右键Compare Text with Previous Selection即可。compareit快速比较两个代码文件不同。
9、共享/远程：
Live Share实时共享代码编辑，跟随团队其他成员的光标，协作调试代码，共享本地服务器，共享终端Live Share Audio可以进行实时的团队语音。Red Hat CommonsRemote - Containers连接Docker容器。（非常惊艳）Remote - SSH通过ssh，连接远程服务器。（平平无奇）Remote - SSH: Editing Configuration FilesRemote - WSL连接“Windows Subsystem for Linux”（就是在Win10中安装的Linux）。Better C++ Syntax
10、markdown/程序包/文件路径/变量函数命名：
Markdownlint + docsify会用绿色波浪线给你提示出 N 多不符合书写规范的地方，同时也可以配合安装 docsify，因为它支持Markdown和每个项目的其他增强。Markdown All in One可以实现媲美Typora的Markdown编辑体验，它具备如下特性，丰富的快捷键,TOC标签,数学公式,自动完成,列表编辑,输出HTML同时转PDF,Github风格文档.Import Cost可以显示咱们在VS代码编辑器中导入的程序包的大小。Path Intellisense引入文件的时候，路径自动补全。自动路径补全。Codelf它通过搜索GitHub, Bitbucket, GitLab来找到真实的使用变量名，为你提供一些高频使用的词汇，同时为你标明使用的语言、代码链接。使用时只需要选中变量名，然后右键选择CodeIf就可以跳转到网页，显示候选命名。change-case快速切换变量格式,大坨峰，小驼峰，下划线等等，它里面有很多类型。使用方法按 F1（windows） ，输入对应命令即可。
11、添加标签/代码截图/单词检查：
TODO Tree当我们发现某块代码需要修改，或者某块代码需要以后进一步完善，如果能够给它做一个标记，那么后续定位到对应位置是一件非常轻松高效的事情。它不仅可以实现标签高亮，还可以在活动栏添加一个选项卡，它能够以不同视图展示我们标记的位置，单击对应标签就能够快速定位到指定位置。Polacode代码截图工具AZ AL Dev Tools/AL Code Outline便于找节点，方法，梳理代码结构，安装完后在文件图标里就会多出一个 AL OUTLINE 的选项。第一层是极具 vue 单文件组件特点的 template，script，style。逐层展开就可以看到 dom 节点， methods 里面定义的函数等，然后点击就可以快速定位到目标所在位置。Code Spell Checker检查代码中单词拼写是否正确
12、实时显示代码运行结果/智能提示代码/提示函数参数/格式转换：
Quokka实时显示代码的运行结果Tabnine智能提示代码，可以预测你将要写的代码进行提示Parameter Hints提示函数的参数类型及消息px to rem & rpx (cssrem)自动换算单位的插件,px转换rem工具。中文标点符号转英文将用户输入的中文标点符号自动更改为英文标点符号，可自定义转换。ESLint
三、快捷键：
在日常的开发中，使用VsCode快捷键，可以提高开发效率！
1、常用 General
按 Press 功能 FunctionCtrl + Shift + P，F1 显示命令面板 Show Command PaletteCtrl + P 快速打开 Quick OpenCtrl + Shift + N 新窗口/实例 New window/instanceCtrl + Shift + W 关闭窗口/实例 Close window/instance
2、基础编辑 Basic editing
按 Press 功能 FunctionCtrl+X 剪切行（空选定） Cut line (empty selection)Ctrl+C 复制行（空选定）Copy line (empty selection)Alt+ ↑ / ↓ 向上/向下移动行 Move line up/downShift+Alt + ↓ / ↑ 向上/向下复制行 Copy line up/downCtrl+Shift+K 删除行 Delete lineCtrl+Enter 在下面插入行 Insert line belowCtrl+Shift+Enter 在上面插入行 Insert line aboveCtrl+Shift+\ 跳到匹配的括号 Jump to matching bracketCtrl+] / [ 缩进/缩进行 Indent/outdent lineHome 转到行首 Go to beginning of lineEnd 转到行尾 Go to end of lineCtrl+Home 转到文件开头 Go to beginning of fileCtrl+End 转到文件末尾 Go to end of fileCtrl+↑ / ↓ 向上/向下滚动行 Scroll line up/downAlt+PgUp / PgDown 向上/向下滚动页面 Scroll page up/downCtrl+Shift+[ 折叠（折叠）区域 Fold (collapse) regionCtrl+Shift+] 展开（未折叠）区域 Unfold (uncollapse) regionCtrl+K Ctrl+[ 折叠（未折叠）所有子区域 Fold (collapse) all subregionsCtrl+K Ctrl+] 展开（未折叠）所有子区域 Unfold (uncollapse) all subregionsCtrl+K Ctrl+0 折叠（折叠）所有区域 Fold (collapse) all regionsCtrl+K Ctrl+J 展开（未折叠）所有区域 Unfold (uncollapse) all regionsCtrl+K Ctrl+C 添加行注释 Add line commentCtrl+K Ctrl+U 删除行注释 Remove line commentCtrl+/ 切换行注释 Toggle line commentShift+Alt+A 切换块注释 Toggle block commentAlt+Z 切换换行 Toggle word wrap
3、导航 Navigation
按 Press 功能 FunctionCtrl + T 显示所有符号 Show all SymbolsCtrl + G 转到行... Go to Line...Ctrl + P 转到文件... Go to File...Ctrl + Shift + O 转到符号... Go to Symbol...Ctrl + Shift + M 显示问题面板 Show Problems panelF8 转到下一个错误或警告 Go to next error or warningShift + F8 转到上一个错误或警告 Go to previous error or warningCtrl + Shift + Tab 导航编辑器组历史记录 Navigate editor group historyAlt + ←/→ 返回/前进 Go back / forwardCtrl + M 切换选项卡移动焦点 Toggle Tab moves focus
4、搜索和替换 Search and replace
按 Press 功能 FunctionCtrl + F 查找 FindCtrl + H 替换 ReplaceF3 / Shift + F3 查找下一个/上一个 Find next/previousAlt + Enter 选择查找匹配的所有出现 Select all occurences of Find matchCtrl + D 将选择添加到下一个查找匹配 Add selection to next Find matchCtrl + K Ctrl + D 将最后一个选择移至下一个查找匹配项 Move last selection to next Find matchAlt + C / R / W 切换区分大小写/正则表达式/整个词 Toggle case-sensitive / regex / whole word
5、多光标和选择 Multi-cursor and selection
按 Press 功能 FunctionAlt +单击 插入光标 Insert cursorCtrl + Alt +↑/↓ 在上/下插入光标 Insert cursor above / belowCtrl + U 撤消上一个光标操作 Undo last cursor operationShift + Alt + I 在选定的每一行的末尾插入光标 Insert cursor at end of each line selectedCtrl + I 选择当前行 Select current lineCtrl + Shift + L 选择当前选择的所有出现 Select all occurrences of current selectionCtrl + F2 选择当前字的所有出现 Select all occurrences of current wordShift + Alt + → 展开选择 Expand selectionShift + Alt + ← 缩小选择 Shrink selectionShift + Alt + （拖动鼠标） 列（框）选择 Column (box) selectionCtrl + Shift + Alt +（箭头键） 列（框）选择 Column (box) selectionCtrl + Shift + Alt + PgUp / PgDown 列（框）选择页上/下 Column (box) selection page up/down
6、丰富的语言编辑 Rich languages editing
按 Press 功能 FunctionCtrl + 空格 触发建议 Trigger suggestionCtrl + Shift + Space 触发器参数提示 Trigger parameter hintsTab Emmet 展开缩写 Emmet expand abbreviationShift + Alt + F 格式化文档 Format documentCtrl + K Ctrl + F 格式选定区域 Format selectionF12 转到定义 Go to DefinitionAlt + F12 Peek定义 Peek DefinitionCtrl + K F12 打开定义到边 Open Definition to the sideCtrl + . 快速解决 Quick FixShift + F12 显示引用 Show ReferencesF2 重命名符号 Rename SymbolCtrl + Shift + . /， 替换为下一个/上一个值 Replace with next/previous valueCtrl + K Ctrl + X 修剪尾随空格 Trim trailing whitespaceCtrl + K M 更改文件语言 Change file language
7、编辑器管理 Editor management
按 Press 功能 FunctionCtrl+F4, Ctrl+W 关闭编辑器 Close editorCtrl+K F 关闭文件夹 Close folderCtrl+\ 拆分编辑器 Split editorCtrl+ 1 / 2 / 3 聚焦到第1，第2或第3编辑器组 Focus into 1st, 2nd or 3rd editor groupCtrl+K Ctrl+ ←/→ 聚焦到上一个/下一个编辑器组 Focus into previous/next editor groupCtrl+Shift+PgUp / PgDown 向左/向右移动编辑器 Move editor left/rightCtrl+K ← / → 移动活动编辑器组 Move active editor group
8、文件管理 File management
按 Press 功能 FunctionCtrl+N 新文件 New FileCtrl+O 打开文件... Open File...Ctrl+S 保存 SaveCtrl+Shift+S 另存为... Save As...Ctrl+K S 全部保存 Save AllCtrl+F4 关闭 CloseCtrl+K Ctrl+W 关闭所有 Close AllCtrl+Shift+T 重新打开关闭的编辑器 Reopen closed editorCtrl+K 输入保持打开 Enter Keep OpenCtrl+Tab 打开下一个 Open nextCtrl+Shift+Tab 打开上一个 Open previousCtrl+K P 复制活动文件的路径 Copy path of active fileCtrl+K R 显示资源管理器中的活动文件 Reveal active file in ExplorerCtrl+K O 显示新窗口/实例中的活动文件 Show active file in new window/instance
9、显示 Display
按 Press 功能 FunctionF11切换全屏 Toggle full screenShift+Alt+1 切换编辑器布局 Toggle editor layoutCtrl+ = / - 放大/缩小 Zoom in/outCtrl+B 切换侧栏可见性 Toggle Sidebar visibilityCtrl+Shift+E 显示浏览器/切换焦点 Show Explorer / Toggle focusCtrl+Shift+F 显示搜索 Show SearchCtrl+Shift+G 显示Git Show GitCtrl+Shift+D 显示调试 Show DebugCtrl+Shift+X 显示扩展 Show ExtensionsCtrl+Shift+H 替换文件 Replace in filesCtrl+Shift+J 切换搜索详细信息 Toggle Search detailsCtrl+Shift+C 打开新命令提示符/终端 Open new command prompt/terminalCtrl+Shift+U 显示输出面板 Show Output panelCtrl+Shift+V 切换Markdown预览 Toggle Markdown previewCtrl+K V 从旁边打开Markdown预览 Open Markdown preview to the side
10、调试 Debug
按 Press 功能 FunctionF9 切换断点 Toggle breakpointF5 开始/继续 Start/ContinueShift+F5 停止 StopF11 / Shift+F11 下一步/上一步 Step into/outF10 跳过 Step overCtrl+K Ctrl+I 显示悬停 Show hover
11、集成终端 Integrated terminal
按 Press 功能 FunctionCtrl+` 显示集成终端 Show integrated terminalCtrl+Shift+` 创建新终端 Create new terminalCtrl+Shift+C 复制选定 Copy selectionCtrl+Shift+V 粘贴到活动端子 Paste into active terminalCtrl+↑ / ↓ 向上/向下滚动 Scroll up/downShift+PgUp / PgDown 向上/向下滚动页面 Scroll page up/downCtrl+Home / End 滚动到顶部/底部 Scroll to top/bottom
