[开发工具]vscode格式化问题

设置vscode格式化代码配置,不过不会保存是自动格式化需要 shift+alt+f 格式化,这个文章只是配置格式化时按两格缩进,双引号变单引号,不强行换行等功能,我用着是挺顺的,分享给大家

1 下载插件
2 删除插件

3 找到设置中的
4 将下面代码复制进去保存

{
  "files.associations": {
    "*.cjson": "jsonc",
    "*.wxss": "css",
    "*.wxs": "javascript",
    "*.js": "javascript"
  },
  "emmet.includeLanguages": {
    "wxml": "html"
  },
  "minapp-vscode.disableAutoConfig": true,
  "[html]": {
    "editor.defaultFormatter": "vscode.html-language-features"
  },
  "javascript": {
    "indent_size": 2
  },
  "css": {
    "indent_size": 2
  },
  "html": {
    "indent_size": 2
  },
  "editor.codeActionsOnSave": null,
  "editor.detectIndentation": false,
  "editor.tabSize": 2,
  "eslint.autoFixOnSave": true, // 每次保存的时候将代码按eslint格式进行修复
  "prettier.eslintIntegration": true, //让prettier使用eslint的代码格式进行校验
  "prettier.semi": false, //去掉代码结尾的分号
  "prettier.singleQuote": true, //使用单引号替代双引号
  "javascript.format.insertSpaceBeforeFunctionParenthesis": true, //让函数(名)和后面的括号之间加个空格
  "vetur.format.defaultFormatter.html": "js-beautify-html", //格式化.vue中html
  "vetur.format.defaultFormatter.js": "vscode-typescript", //让vue中的js按编辑器自带的ts格式进行格式化
  // "vetur.format.defaultFormatterOptions": {
  //     "js-beautify-html": {
  // "wrap_attributes": "force-aligned" //属性强制折行对齐
  //     }
  // },
  "vetur.format.defaultFormatterOptions": {
    "js-beautify-html": {
      "wrap_line_length": 0, // 设置多个字符后换行 0 表示忽略
      "wrap_attributes": "auto", // html 标签属性 换行设置[auto|force|force-aligned|force-expand-multiline] ["auto"]
      "end_with_newline": false // 在文件结尾添加新行
    },
  },
  "eslint.validate": [ //开启对.vue文件中错误的检查
    "javascript",
    "javascriptreact",
    {
      "language": "html",
      "autoFix": true
    },
    {
      "language": "vue",
      "autoFix": true
    }
  ],
  "search.exclude": {
    "**/node_modules": true,
    "**/bower_components": true,
    "**/dist": true
  },
  "window.title": "${dirty}${activeEditorMedium}${separator}${rootName}",
  "[javascript]": {
    "editor.defaultFormatter": "vscode.typescript-language-features"
  },
  "[vue]": {
    "editor.defaultFormatter": "octref.vetur"
  },
  "diffEditor.wordWrap": "on",
  "editor.fontWeight": null,
  // 
  // "javascript.format.enable": false,
  // "javascript.format.insertSpaceAfterCommaDelimiter": false,
  // "javascript.format.insertSpaceAfterFunctionKeywordForAnonymousFunctions": false,
  // "javascript.format.insertSpaceAfterConstructor": false,
  // "javascript.format.insertSpaceAfterKeywordsInControlFlowStatements": false,
  // "javascript.format.insertSpaceAfterOpeningAndBeforeClosingJsxExpressionBraces": false,
  // "javascript.format.insertSpaceAfterOpeningAndBeforeClosingNonemptyBraces": false,
  // "javascript.format.insertSpaceAfterOpeningAndBeforeClosingNonemptyBrackets": false,
  // "javascript.format.insertSpaceAfterOpeningAndBeforeClosingNonemptyParenthesis": false,
  // "javascript.format.insertSpaceAfterOpeningAndBeforeClosingTemplateStringBraces": false,
  // "javascript.format.insertSpaceAfterSemicolonInForStatements": false,
  // "javascript.format.insertSpaceBeforeAndAfterBinaryOperators": false,
  // // "javascript.format.insertSpaceBeforeFunctionParenthesis": false, //让函数(名)和后面的括号之间加个空格
  // "javascript.format.placeOpenBraceOnNewLineForControlBlocks": false,
  // "javascript.format.placeOpenBraceOnNewLineForFunctions": false
}

最后重启vscode