( vue 、C语言)vscode ctrl+s保存自动格式化代码 配置

---

一、格式化代码

Auto Close Tag

Auto Rename Tag

Beautify

Bracket Pair Colorizer

Color Highlight

Dracula Official

ESLint

HTML CSS Support

JavaScript (ES6) code snippets

JavaScript Snippet Pack

jQuery Code Snippets

Manta’s Stylus Supremacy

Path Intellisense

Prettier - Code formatter

stylus

Bootstrap 3 Snippets

二、vue相关

Vetur

vue

Vue 2 Snippets

Vue 3 Snippets

Vue VSCode Snippets

vue-beautify

vue-color

vue-format

vue-helper

三、C语言以及c++

C/C++

C/C++ Extension Pack

C/C++ Runner

C/C++ Snippets

C/C++ Themes

Better C++ Syntax

Code Runner

CodeLLDB

四、设置配置代码

{
    
    
  
    // 是否允许自定义的snippet片段提示
    "editor.snippetSuggestions": "top",
    "editor.fontSize": 15,
    "editor.fontWeight": "400",
    "editor.formatOnType": true,
    "guides.enabled": false,
    "editor.tabSize": 2,
    // 配置文件关联，以便启用对应的提示
    "files.associations": {
    
    
      "*.vue": "vue",
      "*.wxss": "css"
    },
    // 配置emmet是否启用tab展开缩写
    "emmet.triggerExpansionOnTab": true,
    // 配置emmet对文件类型的支持
    "emmet.syntaxProfiles": {
    
    
      "javascript": "jsx",
      "vue": "html",
      "vue-html": "html"
    },
    // 是否开启eslint检测
    "eslint.enable": true,
    // 文件保存时是否根据eslint进行格式化
    "eslint.autoFixOnSave": true,
    // eslint配置文件
    "eslint.options": {
    
    
      "extensions": [
        ".js",
        ".vue"
      ]
    },
    // eslint能够识别的文件后缀类型
    "eslint.validate": [
      "javascript",
      {
    
    
        "language": "vue",
        "autoFix": true
      },
      "html",
      "vue"
    ],
    "search.exclude": {
    
    
      "**/node_modules": true,
      "**/bower_components": true,
      "**/dist": true
    },
    // 格式化快捷键（默认）：Shift+Alt+F
    // #每次保存的时候将代码按eslint格式进行修复 
    "prettier.eslintIntegration": true,
    "terminal.integrated.rendererType": "dom",
    "diffEditor.renderSideBySide": false,
    // vscode默认启用了根据文件类型自动设置tabsize的选项
    "editor.detectIndentation": false,
    // #每次保存的时候自动格式化 
    "editor.formatOnSave": true,
    //  #去掉代码结尾的分号 
    "prettier.semi": false,
    //  #使用单引号替代双引号 
    "prettier.singleQuote": true,
    //  #让函数(名)和后面的括号之间加个空格
    "javascript.format.insertSpaceBeforeFunctionParenthesis": true,
    "vetur.format.enable": true,                           
    "vetur.validation.template": true,                        
    "vetur.validation.interpolation": false,
    // #这个按用户自身习惯选择 
    "vetur.format.defaultFormatter.html": "js-beautify-html",
    // #让vue中的js按编辑器自带的ts格式进行格式化 
    "vetur.format.defaultFormatter.js": "vscode-typescript",
    "vetur.format.defaultFormatterOptions": {
    
    
      "js-beautify-html": {
    
    
        "wrap_attributes": "force-aligned"
        // #vue组件中html代码格式化样式
      }
    },
    // 格式化stylus, 需安装Manta's Stylus Supremacy插件
    "stylusSupremacy.insertColons": false, // 是否插入冒号
    "stylusSupremacy.insertSemicolons": false, // 是否插入分好
    "stylusSupremacy.insertBraces": false, // 是否插入大括号
    "stylusSupremacy.insertNewLineAroundImports": false, // import之后是否换行
    "stylusSupremacy.insertNewLineAroundBlocks": false,
    "workbench.colorTheme": "Dracula",
    "editor.codeActionsOnSave": {
    
    
      "source.fixAll.eslint": true
    },
    "code-runner.runInTerminal": true,
    "workbench.editor.enablePreview": false, // 两个选择器中是否换行
    "editor.parameterHints": true,
"editor.quickSuggestions": {
    
    
    "other": true,
    "comments": true,
    "strings": true
},
"vetur.experimental.templateInterpolationService": true
  }