vscode代码格式化

302 阅读1分钟

settings.json代码格式化配置

{
  "workbench.preferredLightColorTheme": "Atom One Light",
  "editor.fontWeight": "normal",
  "workbench.colorCustomizations": {
    // 写在 Atom One Light  里面则只对该主题有效
    "[Atom One Light]": {
      "editor.background": "#060e06",
      "sideBar.background": "#b8e4be",
      "activityBar.background": "#9cce9c",
      // 终端前景背景色
      "terminal.foreground": "#141416",
      "terminal.background": "#a0ecd9",

      "editor.selectionHighlightBorder": "#94767c00",
      "editor.selectionHighlightBackground": "#f3bf708c",
      "editorIndentGuide.activeBackground": "#9ba4af",
      "editorBracketMatch.background": "#ff8a05a9",
      "editorBracketMatch.border": "#ff0000",
      "tab.activeBackground": "#c0d9f070",

      "titleBar.activeBackground": "#839eb870"
    },
    "editorLineNumber.foreground": "#f19012"
  },
  "workbench.startupEditor": "newUntitledFile",
  // "[vue]": {
  //     "editor.defaultFormatter": "octref.vetur"
  // },
  "workbench.colorTheme": "Monokai Dimmed",
  // "[javascript]": {
  //     "editor.defaultFormatter": "vscode.typescript-language-features"
  // },
  //editor
  // ***** 默认配置 ***** //
  "editor.formatOnSave": true, // 保存时格式化
  "editor.minimap.enabled": true, // 是否显示右侧快速预览
  "editor.fontSize": 14, //设置文字大小
  "editor.lineHeight": 22, //设置代码行高
  "editor.tabSize": 2, // tab 大小为2个空格
  "editor.detectIndentation": false, //  vscode默认启用了根据文件类型自动设置tabsize的选项
  "javascript.format.enable": true, // 编辑器默认的代码检查规则关闭
  "breadcrumbs.enabled": true, // 开启 vscode 文件路径导航

  // ***** prettier配置 ***** //
  "prettier.printWidth": 500, // 超过最大值换行
  "prettier.semi": false, //句尾添加分号
  "prettier.singleQuote": true, // 使用带引号替代双引号
  "prettier.arrowParens": "avoid", // (x) => {} 箭头函数参数只有一个是否要有小括号。avoid:省略括号
  "prettier.bracketSpacing": true, // 在对象,数组括号与文字之间加空格 "{ foo: bar }"
  "prettier.trailingComma": "none", ///对象字面量项尾不能有逗号
  "prettier.eslintIntegration": true, //不让prettier使用eslint的代码格式进行校验

  "prettier.jsxBracketSameLine": false, // 在jsx中:把'>' 是否单独放一行
  "prettier.jsxSingleQuote": true, // 在jsx中:单引号代替双引号

  // ***** vetur配置 ***** //
  "vetur.format.defaultFormatter.html": "js-beautify-html", // vue 文件 template 的格式化工具
  "vetur.format.defaultFormatterOptions": {
    "js-beautify-html": {
      "wrap_line_length": 200, //html超过最大值换行
      "wrap_attributes": "auto",
      "end_with_newline": true
    },
    "prettier": {
      "printWidth": 200, //js超过最大值换行
      "semi": false, //句尾添加分号
      "singleQuote": true, //使用单引号替代双引号,
      "trailingComma": "none" // 禁止随时添加逗号
    }
  },

  //**** 设置默认使用vetur插件 ****  //开启哪个就设置哪个(不选默认prettier)
  "[vue]": {
    "editor.defaultFormatter": "octref.vetur"
  },
  "[html]": {
    "editor.defaultFormatter": "octref.vetur"
  },
  "[javascript]": {
    "editor.defaultFormatter": "octref.vetur"
  }

  //**** 设置默认使用prettier插件 ****  //开启哪个就设置哪个(不选默认prettier)
  // "[vue]": {
  //   "editor.defaultFormatter": "esbenp.prettier-vscode"
  // },
  // "[html]": {
  //   "editor.defaultFormatter": "esbenp.prettier-vscode"
  // },
  // "[javascript]": {
  //   "editor.defaultFormatter": "esbenp.prettier-vscode"
  // }
}