自用vscode拓展插件

自用的vscode插件

<button @click.stop="clickChildren">click</button> 其中.stop是什么插件提示

 

 

VUE2专用插件 

vetur 

vetur和Vue3插件volar:Vue languageFeature,TypeScript Vue Plugin冲突，只能用一个，另外一个禁用

 

VUE3专用插件

volar

Vue languageFeature,TypeScript Vue Plugin和Vue2插件Vetur冲突，只能用一个，另外一个禁用

通用插件

 

 

JavaScript(ES6) code snippets

ES6语法智能提示以及快速输入

除js外还支持.ts，.jsx，.tsx，.html，.vue，省去了配置其支持各种包含js代码文件的时间

 

HTML CSS Support

IntelliSense for CSS class names in HTML

Easy Sass

HTML CSS Support + IntelliSense for CSS class names in HTML + Easy Sass

3者一起用可以实现在.vue文件标签中添加class类名

算了，别配置，会影响到其他的提示。

配置插件属性 找到设置>setting.json

{
  // 保存时格式化 
  "editor.formatOnSave": true,
  "gitlens.advanced.messages": {
    "suppressFileNotUnderSourceControlWarning": true
  },
  // vscode默认启用了根据文件类型自动设置tabsize的选项
  "editor.parameterHints.enabled": true,
  "editor.quickSuggestions": {
    //开启自动显示建议
    "other": true,
    "comments": true,
    "strings": true
  },
  // HTML CSS Support  支持的语言
  "css.enabledLanguages": [
    "html",
    "vue"
  ],
  // HTML CSS Support    其他样式表
  "css.styleSheets": [
    "/src/assets/common.css",
    "${fileBasenameNoExtension}.css"
  ],
  //HTML-CSS-Class-Completion  在编写Emmet缩写时启用补全。
  "html-css-class-completion.enableEmmetSupport": true,
  //  Easy Sass
  "easysass.formats": [
    {
      "format": "expanded",
      "extension": ".css"
    }
  ],
}

参考自 https://blog.csdn.net/h5433/article/details/127531243

Auto Rename Tag

修改 html 标签，自动帮你完成尾部闭合标签的同步修改，和 webstorm 一样

 

Open in browser

HTML打开默认浏览器 

 

json2ts

快速将json文件转换为对应的ts类型

快捷键：ctrl + alt + v 

若不行则使用JSON Tto T

 

JSON to TS

快速将json文件转换为对应的ts类型

快捷键：ctrl + shif + alt + v || s

测试JSON

{
    "errno": 0,
    "errmsg": "ok",
    "IsPrint": false,
    "data": {
        "log_id": "1193158785121881785",
        "action_rule": {
            "pos_1": [],
            "pos_2": [],
            "pos_3": []
        }
    }
}

 

 

Markdown Preview Enhanced

实时预览markdown

快捷键：先按ctrl+k 然后松开所有，再按V。

 

Database Client

mysql可视化工具

 

Git History

查看git提交记录，搜索和更多

 

Chinese (Simplified) (简体中文) Language Pack for Visual Studio Code

汉化工具

 

GitLens

显示代码上一次操作内容（时间作者）