VsCode算是比较热门的一个代码编辑器了,全名Visual Studio Code,微软出品
插件众多,功能齐全,平常开发过程中都是用的它,整理了下日常使用的插件及配置供大家参考,废话就不多说了,直接进入正题。
相关插件
Vetur
插件文档地址:https://marketplace.visualstudio.com/items?itemName=octref.vetur
Vetur不用说了吧,开发Vue必装的一个插件
未安装之前vue文件显示这样的
安装完成后显示这样的,看着舒服多了
Vue 2 Snippets
插件文档地址:https://marketplace.visualstudio.com/items?itemName=hollowtree.vue-snippets
主要加强vue的便捷写法
language-stylus
插件文档地址:https://marketplace.visualstudio.com/items?itemName=sysoev.language-stylus
写stylus用的,如果项目用的stylus写样式推荐安装,其他Sass、LESS等同理安装相应的插件即可。
Auto Close Tag
插件文档地址:https://marketplace.visualstudio.com/items?itemName=formulahendry.auto-close-tag
自动闭合标签所用
配合快捷键Alt+. (Command+Alt+. for Mac)特别好使。
Auto Rename Tag
插件文档地址:https://marketplace.visualstudio.com/items?itemName=formulahendry.auto-rename-tag
自动修改重命名配对的标签
Bookmarks
插件文档地址:https://marketplace.visualstudio.com/items?itemName=alefragnani.Bookmarks
可以对成片的代码做一些书签标记,方便后续查看。
Bracket Pair Colorizer
插件文档地址:https://marketplace.visualstudio.com/items?itemName=CoenraadS.bracket-pair-colorizer
对括号进行着色,方便区分,下面的图分别是安装前后的比较
Copy Relative Path
插件文档地址:https://marketplace.visualstudio.com/items?itemName=alexdima.copy-relative-path
用于复制文件的完整路径和相对路径,有时候我们可能需要复制一些文件的路径,该插件就很方便了。
Path Intellisense
插件文档地址:https://marketplace.visualstudio.com/items?itemName=christian-kohler.path-intellisense
路径自动感知,在配置文件中配置@后我们就可以很方便快捷的引用各种文件了
"path-intellisense.mappings": { "@": "${workspaceRoot}/src"}
Document This
插件文档地址:https://marketplace.visualstudio.com/items?itemName=joelday.docthis
主要用于方法的注释,选中方法名,按两次Ctrl+Alt+D,即可快速生成标准的注释
psioniq File Header
插件文档地址:https://marketplace.visualstudio.com/items?itemName=psioniq.psi-header
按两次Ctrl+Alt+H可快速在文件的头部生成注释信息,如果对默认的注释模板不满意的话,可以在配置文件中自定义注释模板
"psi-header.templates": [ { "language": "*