Visual studio code配置选项

前言

文档：https://www.cnblogs.com/Searchor/p/5594036.html
第二个配置，实现了代码不自动换行，但是，好像也没格式化？？

配置

自己的配置

{
  // vscode默认启用了根据文件类型自动设置tabsize的选项
  "editor.detectIndentation": false,
  // 
  "editor.wrappingColumn": -1,
  // 重新设定tabsize
  "editor.tabSize": 2,
  // #每次保存的时候自动格式化
  "editor.formatOnSave": true,
  // #每次保存的时候将代码按eslint格式进行修复
  "eslint.autoFixOnSave": true,
  // 添加 vue 支持
  "eslint.validate": [
    "javascript",
    "javascriptreact",
    {
      "language": "vue",
      "autoFix": true
    }
  ],
  // #去掉代码结尾的分号
  "prettier.semi": false,
  // #使用带引号替代双引号
  "prettier.singleQuote": true,
  // #让函数(名)和后面的括号之间加个空格
  "javascript.format.insertSpaceBeforeFunctionParenthesis": true,
  // #这个按用户自身习惯选择
  "vetur.format.defaultFormatter.html": "js-beautify-html",
  // #让vue中的js按编辑器自带的ts格式进行格式化
  "vetur.format.defaultFormatter.js": "vscode-typescript",
  "vetur.format.defaultFormatterOptions": {
    "js-beautify-html": {
      "wrap_attributes": "aligned-multiple", // auto force aligned-multiple
      "end_with_newline": false,
    },
    "prettyhtml": {
      "printWidth": 100,
      "singleQuote": false,
      "wrapAttributes": false,
      "sortAttributes": false
    }
  },
  // 格式化stylus, 需安装Manta's Stylus Supremacy插件
  "stylusSupremacy.insertColons": false, // 是否插入冒号
  "stylusSupremacy.insertSemicolons": false, // 是否插入分好
  "stylusSupremacy.insertBraces": false, // 是否插入大括号
  "stylusSupremacy.insertNewLineAroundImports": false, // import之后是否换行
  "stylusSupremacy.insertNewLineAroundBlocks": false, // 两个选择器中是否换行
  "editor.fontSize": 16,
  "editor.wordWrapColumn": 300,
  "files.associations": {
    "*.js": "javascript"
  },
  "editor.codeActionsOnSave": {
    "source.fixAll.eslint": false
  },
  "workbench.tree.indent": 26,
  "files.autoSave": "afterDelay", // 两个选择器中是否换行
}

别人的配置

// 通过将设置放入设置文件中来覆盖设置。
{
  //-------- 编辑器配置 --------
  // 控制字体系列。
  "editor.fontFamily": "Consolas, 'Courier New', monospace",
  // 控制字体大小。
  "editor.fontSize": 14,
  // 控制行高。
  "editor.lineHeight": 0,
  // 控制行号的可见性
  "editor.lineNumbers": true,
  // 控制字形边距的可见性
  "editor.glyphMargin": false,
  // 显示垂直标尺的列
  "editor.rulers": [],
  // 执行文字相关的导航或操作时将用作文字分隔符的字符
  "editor.wordSeparators": "`[email protected]#$%^&*()-=+[{]}\\|;:'\",.<>/?",
  // 一个制表符等于的空格数。
  "editor.tabSize": 4,
  // 按 "Tab" 时插入空格。
  "editor.insertSpaces": true,
  // 当打开文件时，将基于文件内容检测 "editor.tabSize" 和 "editor.insertSpaces"。
  "editor.detectIndentation": true,
  // 控制选取范围是否有圆角
  "editor.roundedSelection": true,
  // 控制编辑器是否可以滚动到最后一行之后
  "editor.scrollBeyondLastLine": true,
  // 控制在多少个字符后编辑器会自动换到下一行。将其设置为 0 则将打开视区宽度换行(自动换行)。将其设置为 -1 则将强制编辑器始终不换行。
  "editor.wrappingColumn": 300,
  // 控制换行的行的缩进。可以是"none"、 "same" 或 "indent"。
  "editor.wrappingIndent": "same",
  // 要对鼠标滚轮滚动事件的 "deltaX" 和 "deltaY" 使用的乘数 
  "editor.mouseWheelScrollSensitivity": 1,
  // 控制键入时是否应显示快速建议
  "editor.quickSuggestions": true,
  // 控制延迟多少毫秒后将显示快速建议
  "editor.quickSuggestionsDelay": 10,
  // 控制编辑器是否应该在左括号后自动插入右括号
  "editor.autoClosingBrackets": true,
  // 控制编辑器是否应在键入后自动设置行的格式
  "editor.formatOnType": false,
  // 控制键入触发器字符时是否应自动显示建议
  "editor.suggestOnTriggerCharacters": true,
  // 控制除了 "Tab" 以外，是否还应在 "Enter" 时接受建议。帮助避免“插入新行”或“接受建议”之间的歧义。
  "editor.acceptSuggestionOnEnter": true,
  // 控制编辑器是否应突出显示选项的近似匹配
  "editor.selectionHighlight": true,
  // 控制可在概述标尺同一位置显示的效果数量
  "editor.overviewRulerLanes": 3,
  // 控制光标闪烁动画，接受的值为'blink'、'visible' 和 'hidden'
  "editor.cursorBlinking": "blink",
  // 控制光标样式，接受的值为 'block' 和 'line'
  "editor.cursorStyle": "line",
  // 启用字体连字
  "editor.fontLigatures": false,
  // 控制光标是否应隐藏在概述标尺中。
  "editor.hideCursorInOverviewRuler": false,
  // 控制编辑器是否应呈现空白字符
  "editor.renderWhitespace": false,
  // 控制编辑器是否显示支持它的模式的参考信息
  "editor.referenceInfos": true,
  // 控制编辑器是否启用代码折叠功能
  "editor.folding": true,
  // 在制表位后插入和删除空格
  "editor.useTabStops": true,
  // 删除尾随自动插入的空格
  "editor.trimAutoWhitespace": true,
  // Keep peek editors open even when double clicking their content or when hitting Escape.
  "editor.stablePeek": false,
  // 控制 Diff 编辑器以并排或内联形式显示差异
  "diffEditor.renderSideBySide": true,
  // 控制差异编辑器是否将对前导空格或尾随空格的更改显示为差异
  "diffEditor.ignoreTrimWhitespace": true,
  //-------- 窗口配置 --------
  // 启用后，将在新窗口中打开文件，而不是重复使用现有实例。
  "window.openFilesInNewWindow": true,
  // 控制重启后重新打开文件夹的方式。选择“none”表示永不重新打开文件夹，选择“one”表示重新打开最后使用的一个文件夹，或选择“all”表示打开上次会话的所有文件夹。
  "window.reopenFolders": "one",
  // 调整窗口的缩放级别。原始大小是 0，每次递增(例如 1)或递减(例如 -1)表示放大或缩小 20%。也可以输入小数以便以更精细的粒度调整缩放级别。
  "window.zoomLevel": 0,
  //-------- 文件配置 --------
  // 配置 glob 模式以排除文件和文件夹。
  "files.exclude": {
    "**/.git": true,
    "**/.svn": true,
    "**/.DS_Store": true
  },
  // 配置语言的文件关联(如: "*.extension": "html")。这些关联的优先级高于已安装语言的默认关联。
  "files.associations": {},
  // 读取和编写文件时将使用的默认字符集编码。
  "files.encoding": "utf8",
  // 默认行尾字符。
  "files.eol": "\r\n",
  // 启用后，将在保存文件时剪裁尾随空格。
  "files.trimTrailingWhitespace": false,
  // 控制已更新文件的自动保存。接受的值:“off”、“afterDelay”、“onFocusChange”。如果设置为“afterDelay”，则可在 "files.autoSaveDelay" 中配置延迟。
  "files.autoSave": "off",
  // 控制延迟(以秒为单位)，在该延迟后将自动保存更新后的文件。仅在 "files.autoSave" 设置为“afterDelay”时适用。
  "files.autoSaveDelay": 1000,
  // 配置文件路径的 glob 模式以从文件监视排除。更改此设置要求重启。如果在启动时遇到 Code 消耗大量 CPU 时间，则可以排除大型文件夹以减少初始加载。
  "files.watcherExclude": {
    "**/.git/objects/**": true
  },
  //-------- Emmet 配置 --------
  // 启用后，按 TAB 键时，将展开 Emmet 缩写。
  "emmet.triggerExpansionOnTab": true,
  //-------- 文件资源管理器配置 --------
  // 在滚动条出现之前将显示的最大工作文件数目。
  "explorer.workingFiles.maxVisible": 9,
  // 控制工作文件部分的高度是否应动态适应元素数量。
  "explorer.workingFiles.dynamicHeight": true,
  // 控制资源管理器是否应在打开文件时自动显示它们。
  "explorer.autoReveal": true,
  //-------- HTTP 配置 --------
  // 要使用的代理设置。如果尚未设置，则将从 http_proxy 和 https_proxy 环境变量获取
  "http.proxy": "",
  // 是否应根据提供的 CA 列表验证代理服务器证书。
  "http.proxyStrictSSL": true,
  //-------- 搜索配置 --------
  // 配置 glob 模式以在搜索中排除文件和文件夹。从 files.exclude 设置中继承所有 glob 模式。
  "search.exclude": {
    "**/node_modules": true,
    "**/bower_components": true
  },
  //-------- 更新配置 --------
  // 配置从中接收更新的更新频道。更改后需要重启。
  "update.channel": "default",
  //-------- GIT 配置 --------
  // 是否启用了 GIT
  "git.enabled": true,
  // 可执行 GIT 的路径
  "git.path": null,
  // 是否启用了自动提取。
  "git.autofetch": true,
  //-------- 标记预览配置 --------
  // 标记预览*使用的 CSS 样式表的 URL 或本地路径列表。
  "markdown.styles": [],
  //-------- JSON configuration --------
  // Associate schemas to JSON files in the current project
  "json.schemas": [],
  //-------- 遥测配置 --------
  // 启用要发送给 Microsoft 的使用情况数据和错误。
  "telemetry.enableTelemetry": true,
  //-------- 遥测配置 --------
  // 启用要发送给 Microsoft 的故障报表。
  // 此选项需重启才可生效。
  "telemetry.enableCrashReporter": true,
  //-------- CSS 配置 --------
  // 控制 CSS 验证和问题严重性。
  // 启用或禁用所有验证
  "css.validate": true,
  // 使用供应商特定前缀时，确保同时包括所有其他供应商特定属性
  "css.lint.compatibleVendorPrefixes": "ignore",
  // 使用供应商特定前缀时，还应包括标准属性
  "css.lint.vendorPrefix": "warning",
  // 不要使用重复的样式定义
  "css.lint.duplicateProperties": "ignore",
  // 不要使用空规则集
  "css.lint.emptyRules": "warning",
  // Import 语句不会并行加载
  "css.lint.importStatement": "ignore",
  // 使用边距或边框时，不要使用宽度或高度
  "css.lint.boxModel": "ignore",
  // 已知通配选择符 (*) 慢
  "css.lint.universalSelector": "ignore",
  // 零不需要单位
  "css.lint.zeroUnits": "ignore",
  // @font-face 规则必须定义 "src" 和 "font-family" 属性
  "css.lint.fontFaceProperties": "warning",
  // 十六进制颜色必须由三个或六个十六进制数字组成
  "css.lint.hexColorLength": "error",
  // 参数数量无效
  "css.lint.argumentsInColorFunction": "error",
  // 未知的属性。
  "css.lint.unknownProperties": "warning",
  // 仅当支持 IE7 及更低版本时，才需要 IE hack
  "css.lint.ieHack": "ignore",
  // 未知的供应商特定属性。
  "css.lint.unknownVendorSpecificProperties": "ignore",
  // 因显示而忽略属性。例如，使用 "display: inline"时，宽度、高度、上边距、下边距和 float 属性将不起作用
  "css.lint.propertyIgnoredDueToDisplay": "warning",
  // 避免使用 !important。它表明整个 CSS 的特异性已经失去控制且需要重构。
  "css.lint.important": "ignore",
  // 避免使用“float”。浮动会带来脆弱的 CSS，如果布局的某一方面更改，将很容易破坏 CSS。
  "css.lint.float": "ignore",
  // 选择器不应包含 ID，因为这些规则与 HTML 的耦合过于紧密。
  "css.lint.idSelector": "ignore",
  //-------- HTML 配置 --------
  // 每行最大字符数(0 = 禁用)。
  "html.format.wrapLineLength": 120,
  // 标记列表，以逗号分隔，不应重设格式。"null" 默认为所有内联标记。
  "html.format.unformatted": "a, abbr, acronym, b, bdo, big, br, button, cite, code, dfn, em, i, img, input, kbd, label, map, object, q, samp, script, select, small, span, strong, sub, sup, textarea, tt, var",
  // 缩进 <head> 和 <body> 部分。
  "html.format.indentInnerHtml": false,
  // 是否要保留元素前面的现有换行符。仅适用于元素前，不适用于标记内或文本。
  "html.format.preserveNewLines": true,
  // 要保留在一个区块中的换行符的最大数量。对于无限制使用 "null"。
  "html.format.maxPreserveNewLines": null,
  // 格式和缩进 {{#foo}} 和 {{/foo}}。
  "html.format.indentHandlebars": false,
  // 以新行结束。
  "html.format.endWithNewline": false,
  // 标记列表，以逗号分隔，其前应有额外新行。"null" 默认为“标头、正文、/html”。
  "html.format.extraLiners": "head, body, /html",
  //-------- LESS 配置 --------
  // 控制 LESS 验证和问题严重性。
  // 启用或禁用所有验证
  "less.validate": true,
  // 使用供应商特定前缀时，确保同时包括所有其他供应商特定属性
  "less.lint.compatibleVendorPrefixes": "ignore",
  // 使用供应商特定前缀时，还应包括标准属性
  "less.lint.vendorPrefix": "warning",
  // 不要使用重复的样式定义
  "less.lint.duplicateProperties": "ignore",
  // 不要使用空规则集
  "less.lint.emptyRules": "warning",
  // Import 语句不会并行加载
  "less.lint.importStatement": "ignore",
  // 使用边距或边框时，不要使用宽度或高度
  "less.lint.boxModel": "ignore",
  // 已知通配选择符 (*) 慢
  "less.lint.universalSelector": "ignore",
  // 零不需要单位
  "less.lint.zeroUnits": "ignore",
  // @font-face 规则必须定义 "src" 和 "font-family" 属性
  "less.lint.fontFaceProperties": "warning",
  // 十六进制颜色必须由三个或六个十六进制数字组成
  "less.lint.hexColorLength": "error",
  // 参数数量无效
  "less.lint.argumentsInColorFunction": "error",
  // 未知的属性。
  "less.lint.unknownProperties": "warning",
  // 仅当支持 IE7 及更低版本时，才需要 IE hack
  "less.lint.ieHack": "ignore",
  // 未知的供应商特定属性。
  "less.lint.unknownVendorSpecificProperties": "ignore",
  // 因显示而忽略属性。例如，使用 "display: inline"时，宽度、高度、上边距、下边距和 float 属性将不起作用
  "less.lint.propertyIgnoredDueToDisplay": "warning",
  // 避免使用 !important。它表明整个 CSS 的特异性已经失去控制且需要重构。
  "less.lint.important": "ignore",
  // 避免使用“float”。浮动会带来脆弱的 CSS，如果布局的某一方面更改，将很容易破坏 CSS。
  "less.lint.float": "ignore",
  // 选择器不应包含 ID，因为这些规则与 HTML 的耦合过于紧密。
  "less.lint.idSelector": "ignore",
  //-------- Sass 配置 --------
  // 控制 Sass 验证和问题严重性。
  // 启用或禁用所有验证
  "sass.validate": true,
  // 使用供应商特定前缀时，确保同时包括所有其他供应商特定属性
  "sass.lint.compatibleVendorPrefixes": "ignore",
  // 使用供应商特定前缀时，还应包括标准属性
  "sass.lint.vendorPrefix": "warning",
  // 不要使用重复的样式定义
  "sass.lint.duplicateProperties": "ignore",
  // 不要使用空规则集
  "sass.lint.emptyRules": "warning",
  // Import 语句不会并行加载
  "sass.lint.importStatement": "ignore",
  // 使用边距或边框时，不要使用宽度或高度
  "sass.lint.boxModel": "ignore",
  // 已知通配选择符 (*) 慢
  "sass.lint.universalSelector": "ignore",
  // 零不需要单位
  "sass.lint.zeroUnits": "ignore",
  // @font-face 规则必须定义 "src" 和 "font-family" 属性
  "sass.lint.fontFaceProperties": "warning",
  // 十六进制颜色必须由三个或六个十六进制数字组成
  "sass.lint.hexColorLength": "error",
  // 参数数量无效
  "sass.lint.argumentsInColorFunction": "error",
  // 未知的属性。
  "sass.lint.unknownProperties": "warning",
  // 仅当支持 IE7 及更低版本时，才需要 IE hack
  "sass.lint.ieHack": "ignore",
  // 未知的供应商特定属性。
  "sass.lint.unknownVendorSpecificProperties": "ignore",
  // 因显示而忽略属性。例如，使用 "display: inline"时，宽度、高度、上边距、下边距和 float 属性将不起作用
  "sass.lint.propertyIgnoredDueToDisplay": "warning",
  // 避免使用 !important。它表明整个 CSS 的特异性已经失去控制且需要重构。
  "sass.lint.important": "ignore",
  // 避免使用“float”。浮动会带来脆弱的 CSS，如果布局的某一方面更改，将很容易破坏 CSS。
  "sass.lint.float": "ignore",
  // 选择器不应包含 ID，因为这些规则与 HTML 的耦合过于紧密。
  "sass.lint.idSelector": "ignore",
  //-------- Integrated terminal configuration --------
  // The path of the shell that the terminal uses on Linux.
  "terminal.integrated.shell.linux": "sh",
  // The path of the shell that the terminal uses on OS X.
  "terminal.integrated.shell.osx": "sh",
  // The path of the shell that the terminal uses on Windows.
  "terminal.integrated.shell.windows": "C:\\Windows\\system32\\cmd.exe",
  // The font family used by the terminal (CSS font-family format).
  "terminal.integrated.fontFamily": "Menlo, Monaco, Consolas, \"Droid Sans Mono\", \"Courier New\", monospace, \"Droid Sans Fallback\"",
  //-------- 外部终端配置 --------
  // Customizes which terminal to run on Windows.
  "terminal.external.windowsExec": "cmd",
  // Customizes which terminal to run on Linux.
  "terminal.external.linuxExec": "xterm",
  //-------- TypeScript 配置 --------
  // 指定包含要使用的 tsserver 和 lib*.d.ts 文件的文件夹路径。
  "typescript.tsdk": null,
  // 完成函数的参数签名。
  "typescript.useCodeSnippetsOnMethodSuggest": false,
  // 启用/禁用 TypeScript 验证
  "typescript.validate.enable": true,
  // 启用对发送到 TS 服务器的消息进行跟踪
  "typescript.tsserver.trace": "off",
  // 定义逗号分隔符后面的空格处理
  "typescript.format.insertSpaceAfterCommaDelimiter": true,
  // 在 For 语句中，定义分号之后的空格处理
  "typescript.format.insertSpaceAfterSemicolonInForStatements": true,
  // 定义二进制运算符后面的空格处理
  "typescript.format.insertSpaceBeforeAndAfterBinaryOperators": true,
  // 定义控制流语句中的关键字之后的空格处理
  "typescript.format.insertSpaceAfterKeywordsInControlFlowStatements": true,
  // 定义匿名函数的函数关键字之后的空格处理
  "typescript.format.insertSpaceAfterFunctionKeywordForAnonymousFunctions": true,
  // 定义非空圆括号的左括号之后和右括号之前的空格处理。
  "typescript.format.insertSpaceAfterOpeningAndBeforeClosingNonemptyParenthesis": false,
  // 定义非空方括号的左括号之后和右括号之前的空格处理。
  "typescript.format.insertSpaceAfterOpeningAndBeforeClosingNonemptyBrackets": false,
  // 定义左大括号是否针对函数而放置在新的一行
  "typescript.format.placeOpenBraceOnNewLineForFunctions": false,
  // 定义左大括号是否针对控制块而放置在新的一行
  "typescript.format.placeOpenBraceOnNewLineForControlBlocks": false,
  // 启用/禁用 JavaScript 验证
  "javascript.validate.enable": true,
  // 定义逗号分隔符后面的空格处理
  "javascript.format.insertSpaceAfterCommaDelimiter": true,
  // 在 For 语句中，定义分号之后的空格处理
  "javascript.format.insertSpaceAfterSemicolonInForStatements": true,
  // 定义二进制运算符后面的空格处理
  "javascript.format.insertSpaceBeforeAndAfterBinaryOperators": true,
  // 定义控制流语句中的关键字之后的空格处理
  "javascript.format.insertSpaceAfterKeywordsInControlFlowStatements": true,
  // 定义匿名函数的函数关键字之后的空格处理
  "javascript.format.insertSpaceAfterFunctionKeywordForAnonymousFunctions": true,
  // 定义非空圆括号的左括号之后和右括号之前的空格处理。
  "javascript.format.insertSpaceAfterOpeningAndBeforeClosingNonemptyParenthesis": false,
  // 定义非空方括号的左括号之后和右括号之前的空格处理。
  "javascript.format.insertSpaceAfterOpeningAndBeforeClosingNonemptyBrackets": false,
  // 定义左大括号是否针对函数而放置在新的一行
  "javascript.format.placeOpenBraceOnNewLineForFunctions": false,
  // 定义左大括号是否针对控制块而放置在新的一行
  "javascript.format.placeOpenBraceOnNewLineForControlBlocks": false,
  //-------- PHP 配置选项 --------
  // 不管 php 验证是否已启用。
  "php.validate.enable": true,
  // 指向可执行的 php。
  "php.validate.executablePath": null,
  // 不管 linter 是在 save 还是在 type 上运行。
  "php.validate.run": "onSave",
  // 启用基于字的建议。
  "editor.wordBasedSuggestions": true
}

使用vetur配置，经过测试，发现如果一行不是特别长，不会换行
文档：https://blog.csdn.net/qq_41725450/article/details/88339056
配置：

"vetur.format.defaultFormatterOptions": {
  "js-beautify-html": {
    "wrap_line_length": 120,
    "wrap_attributes": "auto",
    "end_with_newline": false
  }
}