Javascript技术vscode settings.json代码

代码演示

{
    "workbench.iconTheme": "vscode-icons",
    "git.autofetch": true,
  
    "editor.tabSize": 2,
    // 开启保存后即触发格式化  不开开了会根据"vetur.format.defaultFormatter.js": "vscode-typescript",
    "editor.formatOnSave": true,
    // 关闭右侧快速预览
    "editor.minimap.enabled": true,
    "editor.fontSize": 14, // 设置文字大小
    "editor.lineHeight": 0, // 设置文字行高
    "editor.lineNumbers": "on", // 开启行数提示
    "editor.quickSuggestions": {
      // 开启自动显示建议
      "other": true,
      "comments": true,
      "strings": true
    },
  
    // 用该属性触发eslint修复
    "editor.codeActionsOnSave": {
      "source.fixAll.eslint": true
    },
  
    // 根据文件后缀名定义vue文件类型
    "files.associations": {
      "*.vue": "vue"
    },
    // 添加 vue 支持
    "eslint.validate": ["javascript", "typescript", "vue"],
  
    //"editor.defaultFormatter": "esbenp.prettier-vscode",
  
    // 该属性相当于配置js文件的操作
    "[javascript]": {
      "editor.defaultFormatter": "esbenp.prettier-vscode"
    },
    
    "[typescript]": {
      "editor.defaultFormatter": "esbenp.prettier-vscode"
    },
  
    "[vue]": {
      "editor.defaultFormatter": "octref.vetur"
    },

    // 是否使用尾逗号，有三个可选值"<none|es5|all>"
    "prettier.trailingComma": "none",
    // 对象大括号直接是否有空格，默认为true，效果：{ foo: bar }
    "prettier.bracketSpacing": true,
    // 使用带引号替代双引号
    "prettier.singleQuote": true,
    // 声明结尾使用分号(默认true)
    "prettier.semi": false,
    // 只有一个参数的箭头函数的参数是否带圆括号（默认avoid）
    "prettier.arrowParens": "avoid",
    // 多行JSX中的>放置在最后一行的结尾，而不是另起一行（默认false）
    "prettier.jsxBracketSameLine": false,
    "prettier.useTabs": false,
    "prettier.printWidth": 100,
  
    // 关闭rg.exe进程 用cnpm导致会出现rg.exe占用内存很高
    "search.followSymlinks": false,
  
    // 默认格式化vue中的<script> region的方式,按编辑器自带的ts格式进行格式化
    "vetur.format.defaultFormatter.js": "prettier",
    "vetur.format.defaultFormatter.ts": "prettier",
    // 默认格式化vue中的<template> region的方式
    // 由于prettier不能格式化vue文件template  所以使用js-beautify-html格式化
    // https://vuejs.github.io/vetur/formatting.html#formatters
    "vetur.format.defaultFormatter.html": "prettier",
    // 给js-beautify-html设置属性隔断
    "vetur.format.defaultFormatterOptions": {
      "js-beautify-html": {
        "wrap_line_length": 100,
        /* 对属性进行换行。
         * - auto: 仅在超出行长度时才对属性进行换行。
         * - force: 对除第一个属性外的其他每个属性进行换行。
         * - force-aligned: 对除第一个属性外的其他每个属性进行换行，并保持对齐。
         * - force-expand-multiline: 对每个属性进行换行。
         * - aligned-multiple: 当超出折行长度时，将属性进行垂直对齐。*/
        "wrap_attributes": "force-aligned",
        // 一次最多保留多少行的空行，默认10
        "max_preserve_newlines": 1,
        "end_with_newline": false
      },
      "prettier": {
        "trailingComma": "none",
        "bracketSpacing": true,
        "singleQuote": true,
        "semi": false,
        "arrowParens": "avoid",
        "useTabs": false,
        "printWidth": 100
      }
    },
    // <script>标签默认偏移一个indent
    "vetur.format.scriptInitialIndent": false,
    // <style>默认偏移一个indent
    "vetur.format.styleInitialIndent": false,
    // 函数名后增加空格
    // Javascript
    "javascript.format.insertSpaceBeforeFunctionParenthesis": true,
    "javascript.format.insertSpaceAfterFunctionKeywordForAnonymousFunctions": true,
    // Typescript
    "typescript.format.insertSpaceBeforeFunctionParenthesis": true,
    "typescript.format.insertSpaceAfterFunctionKeywordForAnonymousFunctions": true
  
  }