目录
JavaScript (ES6) code snippets
前言
VS Code 全称 Visual Studio Code 是由微软开发的一款免费、跨平台的轻量级代码编辑器。以功能强大、提示友好、不错的性能和颜值俘获了大量开发者的青睐,对 JavaScript 和 NodeJS 的支持非常好,自带很多功能,例如代码格式化,代码智能提示补全等。
一、美化插件
Material Theme
Material Theme 插件是一款用于美化主题的图标的插件,该插件包含两个子插件, Community Material Theme 用于美化主题,还有一个 Material Theme Icons 用于美化图标
Material Icon Theme
采用了 Google Material Design 风格,文件图标以及文件夹图标覆盖全面
二、高效插件
Auto Close Tag
自动添加 HTML/XML 关闭标记
Auto Rename Tag
自动重命名成对的 HTML/XML 标签
Image Preview
代码中hover直接预览图片,支持css、svg格式预览
open in browser
在html文件中,右键点击,然后选择浏览器打开文件
Prettier - Code formatter
格式化js、css代码插件
ESLint
用于JavaScript代码的语法检查和风格检查。它可以帮助开发人员在编写代码时遵循一致的编码规范,从而提高代码的可读性和可维护性
三、Markdown 插件
Markdown 是一种易于读写的轻量级的标记语言,编写出的作品简洁美观,近年来受到了越来越多的追捧,被广泛地用于日常写作,乃至电子书发表
Markdown Preview Enhanced
Markdown Preview Enhanced 插件意在让你拥有飘逸的 Markdown 写作体验,直接预览编辑效果。同时可以选择不同风格的显示
Markdown All in One
集成了编辑 Markdown 文件时需要的大部分功能,包括 Markdown 样式快捷键、列表的自动化处理、自动格式化表格、数学公式支持、自动补全
四、JS插件
JavaScript (ES6) code snippets
包含ES6语法中的JavaScript代码段(支持JavaScript和TypeScript)
五、Bootstrap插件
Bootstrap IntelliSense
增强使用Bootstrap的开发体验,提供CSS类的自动补全功能。该工具简化了Bootstrap的工作,使开发过程更加高效
六、CSS插件
CSS Class Intellisense
适用于先在css写了样式,在html中写入样式时提示
HTML CSS Support
提供 HTML 和 CSS 的语法高亮、代码提示和自动补全等功能
HTML to CSS autocompletion
HTML中新定义的id和class,在编写CSS文件时,智能提示id和class
七、Vue3插件
vscode-element-helper
基于 ElementUI 的自动补全插件
Vue 3 Snippets
提供 Vue 3 相关的代码片段,支持 Vue 组件选项、指令、生命周期
Vue Language Features (Volar)
让vue文件的内容颜色区分,同时支持点击相对路径文件的跳转,class名的样式定位(前提是这个class名和样式必须在同一个文件里)
Vue Peek
快速跳转到组件、模块定义的文件
Vue VSCode Snippets
自定义Vue 片段, 快速生成Vue模板
总结
vscode编辑器是可高度自定义的,我们使用vscode插件几乎可以对vscode编辑器进行所有形式的自定义,只要你想做,基本上没有不能实现的。