首页 > 技术文章 > Visual Studio Code 扩展工具集,记录

fighxp 2018-01-05 16:27 原文

编码 提高效率及校验

  • Auto Close Tag  自动闭合标签
  • Auto Rename Tag  自动更改HTML/XML标签,不需要再进行二次修改,减少50%的工作量!
  • Path Intellisense   文件路径自动补全
  • Bracket Pair Colorizer   对括号对进行着色,再也不会搞不清状况了。
  • vscode-fileheader    ctrl+alt+i在文件开头自动输入作者信息和修改信息等内容
  • vscode-fileheader: 添加头header comment,厉害的
  • TSLint       校验ts语法
  • Document This    目前vscode上最好的ts注释插件
  • TypeScript         typescript必备插件
  • Class autocomplete for HTML      自动补全 css 中类名
  • Prettier Formatter  代码统一格式化,团队内部开发人员空行等格式统一化
  • Eslint  语法校验
  • Npm  nodejs依赖环境
  • Npm Intellisense  可视化npm脚本
  • HTML Snippets  输入div按回车键后自动生成<div></div>
  • JavaScript (ES6) code snippets   ES6语法智能提示,以及快速输入,不仅仅支持.js,还支持.ts,.jsx,.tsx,.html,.vue,省去了配置其支持各种包含js代码文件的时间
  • jQuery Code Snippets   Jquery 代码智能提示
  • vetur  vue文件语法高亮

调试

  • Debugger for Chrome  

git备份、团队合作

  • Git History 可以查看Git log, file, 和line 历史记录。
  • git blame

软件使用体验

  • VSCode Great Icons     Icons主题,对展开的文件有变色处理,很容易分辨,Windows上设置方法:(文件——首选项——文件图标主题—— )
  • vscode-icons       文件前面显示文件类别小图标,需配置
  • monokia dimmed    软件皮肤主题
  • Setting Sync:         同步你在不同地方编辑器上的设置和插件,网络教程
  • background      编辑器设置背景  

小工具

  • LICEcap  录屏小工具

html预览

本地服务器

  • with live server     ctrl+alt+o 开启本地服务器,使用  http://127.0.0.1:5500/seckill.html 地址访问页面

暂未使用

  • output colorizer  输出着色

 


 

VSCODE 全局搜索无效的问题

  1. 打开设置
  2. 把如下代码复制粘贴进入
  3. 重启vscode后生效
"search.exclude": {
   "system/": true,
   "!/system/**/*.ps*": true
 }

 

推荐阅读