跳至主要內容

VSCode常用的扩展

扩展安装路径: C:\Users\用户名.vscode\extensions VSCode配置文件C:\Users\用户名\AppData\Roaming\Code

文件-->首选项-->设置-->用户设置-->文本编辑器 Editor: Mouse Wheel Zoom 按住 Ctrl 键并滚动鼠标滚轮时对编辑器字体大小进行缩放

自定义字体(Fira Code)
// 引入Fira Code字体
// 安装包
"editor.fontFamily": "'Fira Code',Consolas, 'Courier New', monospace",
// 开启/关闭字体连字
"editor.fontLigatures": true,
Brogrammer Theme主题
Material Icon Theme

文件后缀图标

Vetur

语法高亮、智能感知、Emmet等

Vue 2 Snippets for Visual Studio Code

语法高亮

HTML Snippets

超级实用且初级的 H5代码片段以及提示

VSCode中文简体包

Chinese (Simplified) Language Pack for Visual Studio Code

Sublime Text Keymap and Settings Importer

sublime按键映射

HTML CSS Support

让 html 标签上写class 智能提示当前项目所支持的样式 新版已经支持scss文件检索

Debugger for Chrome

让 vscode 映射 chrome 的 debug功能，静态页面都可以用 vscode 来打断点调试，真666~

jQuery Code Snippets

jquery 重度患者必须品，废话不多说

Path Intellisense

自动路劲补全，默认不带这个功能的

VueHelper

snippet代码片段

rg.exe占用cpu过高

安装完成之后文件->首选项->搜search.followSymlinks“改为false

Bookmarks

书签 | 快捷跳转代码 配置文件路径: .vscode\bookmarks.json 配置项: "bookmarks.navigateThroughAllFiles": true, "bookmarks.saveBookmarksInProject": true, "bookmarks.useWorkaroundForFormatters": true, "bookmarks.sideBar.expanded": true,

Project Manager

所有项目汇总,快速打开 配置文件路径: C:\Users\用户名\AppData\Roaming\Code\User\globalStorage\alefragnani.project-manager\projects.json

VSCode Dimmer

手电筒聚焦 配置项: "dimmer.context": 8, "dimmer.enabled": true, "dimmer.opacity": 70,

Bracket Pair Colorizer 2

括号对彩色化

GitLens

通过Git blame注释和代码透镜，一眼就能看到代码作者的身份

Auto Close Tag

自动标签闭合

Auto Rename Tag

重命名起始标签时自动更新闭合标签

ES7 React/Redux/GraphQL/React-Native snippets

提供了JavaScript和ES7中的React/Redux代码片段，以及VSCode的Babel插件特性。

npm

自动检测依赖是否安装，还可以提示依赖的版本和具体项目地址

npm Intellisense

编写JavaScript的时候有npm依赖包的提示。特别是引用的过程中会有丰富的提示

Change Case

可以将变量名切换成各种常用造型,驼峰的,大驼峰的,糖葫芦的,随便切,再也不用选个字母改大小写了,可以说非常的贴心啦

EditorConfig

换行符+缩进等问题是这个插件统统都能统一 “EditorConfig帮助开发人员在不同的编辑器和IDE之间定义和维护一致的编码样式。EditorConfig项目由用于定义编码样式的文件格式和一组文本编辑器插件组成，这些插件使编辑器能够读取文件格式并遵循定义的样式。EditorConfig文件易于阅读，并且与版本控制系统配合使用。” 不同的开发人员，不同的编辑器，有不同的编码风格，而EditorConfig就是用来协同团队开发人员之间的代码的风格及样式规范化的一个工具，而.editorconfig正是它的默认配置文件。

  • 具体配置详见项目根目录【.editorconfig】文件
  • 命令行工具里执行: git config --global core.autocrlf true

设置autocrlf为true，添加文件到git仓库（即提交代码）时，git将其视为文本文件。他将把crlf变成lf。 具体配置

# 告诉EditorConfig插件，这是根文件，不用继续往上查找
root = true

# 匹配全部文件
[*]
charset = utf-8
# 结尾换行符，可选"lf"、"cr"、"crlf"
end_of_line = lf
# 在文件结尾插入新行
insert_final_newline = true
# 缩进风格，可选"space"、"tab"
indent_style = space
# 缩进数
indent_size = 2
# 删除一行中的前后空格
trim_trailing_whitespace = true
贡献者: guo