Settings.json

需要vuter、eslint、prettier三个插件 "editor.tokenColorCustomizations">>>"textMateRules">>>"scope" 设置参数使用Ctrl+Shift+P选择下面这个，将鼠标悬浮到想要设置的文字或标签上，箭头所指表示，对当前区域生效的标签，直接拷贝放到scope中就行了。

{
    // 字体加粗
    "editor.fontWeight": "bold",
    // 设置vue斜体
  "editor.tokenColorCustomizations": {
    "textMateRules": [
      {
        "scope": [
            "entity.other.attribute-name",
          "entity.name.tag.block.any.html",
          "entity.name.tag.html",
          "punctuation.definition.string.end.html",
          "string.quoted.double.html",
          "source.directive.vue",
          "meta.directive.vue",
          "text.html.vue-html",
          "eta.tag.block.any.html",
          "string.quoted.double.js",
          "variable.other.readwrite.js",
          "entity.name.tag",
          "string.quoted",

          "comment",
          "function",
          "entity.name.type.class", //class names
          "constant", //String, Number, Boolean…, this, super
          "storage", //static keyword
          "keyword", //import, export, return…
          "variable.other.global",
          "variable.other.local", // 局部变量
          "variable.parameter", // 形参
          "string",
          "constant",
          "source.vue meta.object-literal.key",
          "source.vue meta.method-call entity.name.function",
          "source.vue",
          "source.js",
          "entity.name.tag.template.html",
        ],
        "settings": {
          "fontStyle": "italic"
        }
      }
    ]
  }
  
    "workbench.iconTheme": "vscode-icons-mac",
    "security.workspace.trust.untrustedFiles": "open",
    "remote.SSH.remotePlatform": {
        "alias": "linux"
    },
    "explorer.compactFolders": false,
    "workbench.colorTheme": "Night Owl",
    "editor.fontLigatures": false,
    "editor.mouseWheelZoom": true,
    "[typescript]": {
        "editor.defaultFormatter": "esbenp.prettier-vscode"
    },
     // prettier相关设置
  // 使能每一种语言默认格式化规则
  "[html]": {
    "editor.defaultFormatter": "vscode.html-language-features",
  },
  "[javascript]": {
    "editor.defaultFormatter": "vscode.typescript-language-features",
  },
 
  "editor.formatOnSave": true, // 保存格式化
  // html不换行
  "js-beautify-html": {
    // 换行
    // "wrap_attributes": "force-aligned"
    // 不换行 
    "wrap_attributes": "auto",
    // "wrap_attributes": "aligned-multiple",
  },
  "prettier": {
    "printWidth": 300, // 代码宽度  js超过 300换行
    "bracketSameLine": true,
    "trailingComma": "none", //禁止随时添加逗号,这个很重要。找了好久
    "singleQuote": true, // 单引号不自动转换双引号
    "semi": false, // 不添加分号
    "proseWrap": "preserve", // 代码超出是否要换行 preserve保留
    "arrowParens": "avoid", // 箭头函数一个参数不加括号
  },
  "files.associations": {
    "*.html": "html"
  },
  "backgroundCover.autoStatus": true,
  "editor.fontSize": 14,  // 设置字体
  "editor.tabSize": 2,    // 设置tab位2个空格，设置后在页面可查看.
  "editor.tabCompletion": "on",  // 用来在出现推荐值时，按下Tab键是否自动填入最佳推荐值
  "editor.codeActionsOnSave": {
      "source.fixAll.eslint": true,
      "source.organizeImports": true    // 这个属性能够在保存时，自动调整 import 语句相关顺序，能够让你的 import 语句按照字母顺序进行排列
  },
  "editor.lineNumbers": "on",  // 设置代码行号
  "explorer.confirmDelete": false, 
  // #让vue中的js按"prettier"格式进行格式化
  "vetur.format.defaultFormatter.html": "js-beautify-html",
  "vetur.format.defaultFormatter.js":"prettier-eslint",
  "vetur.format.defaultFormatterOptions": {
      "js-beautify-html": {
          // #vue组件中html代码格式化样式
          "wrap_attributes": "force-aligned", //也可以设置为“auto”，效果会不一样
          "wrap_line_length": 200,
          "end_with_newline": false,
          "semi": false,            "singleQuote": true
        },
        "prettier": {
            "semi": false,
            "singleQuote": true,
            "editor.tabSize": 2
        },
        "prettyhtml": {
            "printWidth": 160,
            "singleQuote": false,
            "wrapAttributes": false,
            "sortAttributes": false
        }
    },
  // 设置编译器默认使用vetur方式格式化代码
  "[vue]": {
    "editor.defaultFormatter": "octref.vetur"
  },
}