vscode编辑器插件总结

来源:互联网 发布:crt结束tomcat端口 编辑:程序博客网 时间:2024/05/24 04:35

之前一直用webstorm,webstorm确实太重了,后来无意中发现了vscode。高颜值吸引了我哈哈哈…就一直用着。

VScode下载地址:点击下载

VScode详细用法:点击查看

很喜欢VScode的插件功能~想要什么插件就搜索,比如搜索angular

这里写图片描述

以下是我装的一些插件,记录防止下次装机

只要点击一下某款插件,插件的介绍和用法都会在右侧窗口详细介绍,还会有小动画演示用法

  • Auto Rename Tag——自动同步修改标签
  • AutoFileName——自动补全路径提示
  • background——一个萌萌的插件,可以自己设置vsc的背景图。(我的少女心哈哈哈…)
  • Bootstrap 3 Snippets——bootstrap必备
  • Debugger for Chrome ——方便调试
  • Document This——Js的注释模板
  • ESLint——检测JS必备
  • Easy Less—— less文件自动实时编译成css
  • GBKtoUTF8
  • Git History (git log)
  • HTML CSS Support——css自动补齐
  • HTML Snippets——支持HTML5的标签提示
  • JavaScript (ES6) code snippets
  • jQuery Code Snippets——jquery 自动提示
  • JS-CSS-HTML Formatter——代码对齐。每次保存代码的时候它会自动对齐代码
  • Markdown Theme Kit——一款markdown主题
  • node-readme
  • Npm Intellisense——npm包代码提示
  • One Dark Theme——一款背景主题
  • Path Intellisense——路径自动补全
  • Project Manager
  • Sort lines
  • Typings Installer——安装vscode 的代码提示依赖库,基于typtings的,比如提示angular或者jQuery智能感知
  • vetur——目前比较好的Vue语法高亮
  //vetur的配置[文件-首选项-设置]在右侧覆盖~    "emmet.syntaxProfiles": {        "vue-html": "html",        "vue": "html"    },    "eslint.validate": [        "javascript",        "javascriptreact",        "vue"    ],    "files.associations": {        "*.vue": "vue"    }
  • View In Browser——在浏览器中预览页面(ctrl+F1)
  • VS Color Picker——拾色器
  • vscode-icons——让vscode资源目录加上图标
  • vue
  • Vue 2 Snippets——vue2语法高亮

设置字体大小等:

[文件-首选项-设置] 在右侧覆盖

设置快捷键

[文件-首选项-键盘快捷方式] 在右侧覆盖

这里写图片描述

因为之前一直用的webstorm,习惯了webstorm的快捷键。所以我把常用的快捷键设置成了webstorm的:(把一以下代码放在右侧覆盖)你也可以自己配置你的常用快捷键

// 将键绑定放入此文件中以覆盖默认值[    {        "key": "shift+enter",        "command": "editor.action.insertLineAfter",        "when": "editorTextFocus && !editorReadonly"    },    {        "key": "ctrl+shift+/",        "command": "editor.action.blockComment",        "when": "editorTextFocus"    },    {        "key": "ctrl+alt+l",        "command": "editor.action.formatDocument",        "when": "editorHasDocumentFormattingProvider && editorTextFocus && !editorReadonly"    },    {        "key": "ctrl+d",        "command": "editor.action.copyLinesDownAction",        "when": "editorTextFocus && !editorReadonly"    }]

注意:
vsCode不支持一窗口同时打开多个文件夹…..额,那只能ctrl+shift+n 再开一个新窗口

6.13补充:

VScode一直在更新,最近更新后,界面显示语言变成了英文。如果想设置成中文,按住f1 或者ctrl+shift+p 进入命令行,输入“ Configure Language”

这里写图片描述

这里写图片描述

上图是英文:en
配置成中文:zh-CN

1 0