VSCode 使用入门及常用设置

日期:2018年11月17日 阅读次数:1796 分类:工具类

安装

下载:点我去下载
安装:双击即可安装,根据需要选择即可。

 

一、配置

(1) Ctrl + Shift + P或F1打开命令面板(也可以使用 查看->命令面板打开);
(2) 输入user settings后按回车打开用户配置;
(3) 点击右上角倒数第三个按钮“打开设置(json)”,进入配置json。

或者

(1) 选择“文件” -> “首选项” -> “设置”
(2) 点击右上角倒数第三个按钮“打开设置(json)”,进入配置json。

1.1、常见配置

  • 使用”editor.fontFamily”:”Consolas, ‘Courier New’, monospace”选择字体样式,默认为”Consolas, ‘Courier New’, monospace”;
  • 使用editor.fontSize”:14控制字体大小,默认为14;
  • 使用”editor.wrappingColumn”:0使文本自动换行,默认为300;

在左侧的默认配置中会有详细的中文描述,配置文件是json格式的文本文档。

1.2、ESLint相关配置

ESLint是代码检测工具,可以提高程序员的代码质量和好的代码编写规范。
下面是VS Code的ESLint的代码校验和保存自动校正代码格式的配置。

{
  "eslint.autoFixOnSave": true, // 保存自动校正代码格式【总开关】
  // 需要校验的代码类型配置
  "eslint.validate": [
      // 校验并自动修复代码格式
      {
      "language": "html",
      "autoFix": true // 针对该语言的自动修复代码格式开关
      },
      {
      "language": "vue",
      "autoFix": true // 针对该语言的自动修复代码格式开关
      },
      // 只校验不自动修复代码格式
      "javascript",
      "javascriptreact"
  ]
}

 

二、插件

Ctrl + Shift + P或F1打开扩展面板,输入install后按回车打开扩展安装面板;或点击侧边栏的最后一个按钮;或使用ctrl + shift + x命令打开;或使用 查看->扩展打开扩展面板。

在对话框中输入[string ]@sort:installs可以根据下载量排序查看,选择所需插件,单击安装即可。

  • @sort:installs:根据下载量排序查看所有插件,asc 升序排列,desc 降序排列。
  • @sort:rating:分级查看,asc 升序排列,desc 降序排列。
  • string可以为空

2.1、推荐插件:

  • C/C++:添加C/C++支持,包括但不限于自动补全
  • Python:自动缩进,补全,查错,debug,代码格式化等等
  • beautify:格式化html,css,js
  • vscode-icons:一款很火的图标主题
  • HTML Snippets:可以在不输入 < 的情况下提示
  • View In Browser:在浏览器中打开 HTML 文件
  • Crane – PHP Intellisense:PHP代码的自动补全插件
  • jQuery Code Snippets:一款jQuery重度患者的插件
  • Debugger for Chrome :调试JavaScript
  • Git History:显示git log和line history

 

三、Git 的使用

需要本机已经安装 Git
无需安装插件,单击侧边栏的第三个图标即可进行 add、commit、push、pull。(或者使用ctrl+shift+g打开,或使用 查看->Git 打开Git)

 

四、主题更换

图标主题:Ctrl+shift +p打开命令面板,输入 icon theme 后回车,选择一个即可。
颜色主题:Ctrl+shift +p打开命令面板,输入 color theme 后回车,选择一个即可。

 

五、跳转

跳转到文件:Ctrl+P。
跳转到符号:Ctrl+shift+o,可以跳转到文件中的方括号、大括号等等。
跳转到行:Ctrl+G,可以跳转到指定行。

 

六、Debug

使用ctrl+d打开debug面板。
可以根据需要配置launch.json

 

七、其它常用功能

Emmet:使用Tab自动补全HTML标签
Markdown Preview:使用Ctrl + shift + v预览markdown文件
使用shift + alt + up/down可以向上/下复制选中内容或者当前行

来源:https://www.jianshu.com/p/efa870f8d633