VS code 代码自动格式化4（vue3）

保留vue2,并且vue3 代码格式化成功

与VS code 代码自动格式化3（vue2 代码自动格式化）不同点有三处

1、[vue]："editor.defaultFormatter":  "dbaeumer.vscode-eslint" 改为  “octref.vetur”

2、[javascript]："editor.defaultFormatter":  "HookyQR.beautify" 改为  “esbenp.prettier-vscode”

3、新增 "editor.formatOnSave": true

代码如下：

"[vue]" : {
    // "editor.defaultFormatter": "dbaeumer.vscode-eslint"
    "editor.defaultFormatter" :  "octref.vetur"
  }, 
"[javascript]" : {
    // "editor.defaultFormatter": "HookyQR.beautify"
    "editor.defaultFormatter" :  "esbenp.prettier-vscode"
  },
"editor.formatOnSave" :  true

vue2 + 修改代码如下：（完整代码）

{
  // "git.enableSmartCommit": true,
  // "git.confirmSync": false,
  "diffEditor.ignoreTrimWhitespace": false,
  "files.autoSave": "afterDelay",
  "files.associations": {
    "*.vue": "vue",
    "*.wpy": "vue",
    "*.wxml": "wxml",
    "*.cjson": "jsonc",
    "*.wxss": "css",
    "*.wxs": "javascript",
    "*.html": "html"
  },
  //通过界面能够修改的配置
  "eslint.run": "onSave",
  "eslint.format.enable": true,
  "eslint.migration.2_x": "off",
  "eslint.enable": true, //是否开启vscode的eslint
  "eslint.alwaysShowStatus": true,
  "eslint.options": {
    //指定vscode的eslint所处理的文件的后缀
    "extensions": [".js", ".vue", ".ts", ".tsx"]
  },
  // 配置 ESLint 检查的文件类型 autoFix默认开启，只需输入字符串数组即可
  "eslint.validate": [
    "javascript",
    "javascriptreact",
    "vue-html",
    "html",
    "vue"
    //{"language": "vue","autoFix": true}
  ],
  "editor.tabSize": 2,
  "editor.codeActionsOnSave": {
    "source.fixAll.eslint": true
  },
  //安装live Server插件
  "liveServer.settings.donotShowInfoMsg": true,
  "liveServer.settings.donotVerifyTags": true,
  "liveServer.settings.NoBrowser": true,
  "prettier.semi": false, //  #去掉代码结尾的分号
  "prettier.singleQuote": true, //  #使用单引号替代双引号
  "prettier.eslintIntegration": true,
  "svn.enableProposedApi": "product",
  // "search.followSymlinks": false,
  "typescript.check.npmIsInstalled": false,
  "[vue]": {
    // "editor.defaultFormatter": "dbaeumer.vscode-eslint"
    "editor.defaultFormatter": "octref.vetur"
  },
  "[html]": {
    "editor.defaultFormatter": "vscode.html-language-features"
  },
  "[css]": {
    "editor.defaultFormatter": "HookyQR.beautify"
  },
  "[scss]": {
    "editor.defaultFormatter": "HookyQR.beautify"
  },
  "[jsonc]": {
    "editor.defaultFormatter": "esbenp.prettier-vscode"
  },
  "[javascript]": {
    // "editor.defaultFormatter": "HookyQR.beautify"
    "editor.defaultFormatter": "esbenp.prettier-vscode"
  },
  "[typescript]": {
    "editor.defaultFormatter": "vscode.typescript-language-features"
  },
  "json.schemas": [
    {
      "fileMatch": ["/myfile"],
      "url": "schemaURL"
    }
  ],
  "[git-commit]": {
    "editor.rulers": [72],
    "workbench.editor.restoreViewState": false
  },
  "git.autofetch": true,
  // 格式化stylus, 需安装Manta's Stylus Supremacy插件
  "stylusSupremacy.insertColons": false, // 是否插入冒号
  "stylusSupremacy.insertSemicolons": false, // 是否插入分好
  "stylusSupremacy.insertBraces": false, // 是否插入大括号
  "stylusSupremacy.insertNewLineAroundImports": false, // import之后是否换行
  "stylusSupremacy.insertNewLineAroundBlocks": false,

  "beautify.language": {
    "js": {
      "type": ["javascript", "json", "jsonc"],
      "filename": [".jshintrc", ".jsbeautifyrc"]
    },
    "css": ["css", "less", "scss"],
    "html": ["htm", "html"]
  },
  "vsicons.dontShowNewVersionMessage": true,
  "guides.enabled": false,
  "vsintellicode.modify.editor.suggestSelection": "automaticallyOverrodeDefaultValue",
  "react-native-tools.showUserTips": false, // 两个选择器中是否换行
  // vscode默认启用了根据文件类型自动设置tabsize的选项
  "editor.detectIndentation": false,
  // "editor.fontLigatures": false, // 是否启用字体连字
  "editor.fontLigatures": null, // 是否启用字体连字
  "editor.suggestSelection": "first",
  "editor.renderControlCharacters": true,
  "editor.multiCursorModifier": "ctrlCmd", // 两个选择器中是否换行
  // "editor.snippetSuggestions": "none",
  // 控制键入触发器字符时是否应自动显示建议
  "editor.suggestOnTriggerCharacters": false,
  // 控制是否根据文档中的文字计算自动完成列表。
  "editor.wordBasedSuggestions": false,
  "editor.suggest.showFunctions": false,
  "editor.suggest.showInterfaces": false,
  "editor.acceptSuggestionOnCommitCharacter": false,
  // "editor.quickSuggestions": null, //是否开启.vue项目,标准格式化规范.eslintrc.js
  "editor.quickSuggestions": {
    "strings": false
  },
  "emmet.includeLanguages": {
    "wxml": "html"
  },
  "minapp-vscode.disableAutoConfig": true,
  //  #让函数(名)和后面的括号之间加个空格
  "javascript.format.insertSpaceBeforeFunctionParenthesis": true,
  // #让vue中的js按编辑器自带的ts格式进行格式化
  "vetur.format.defaultFormatter.js": "vscode-typescript",
  "vetur.format.defaultFormatter.html": "js-beautify-html",
  //一定要在vutur.defaultFormatterOptions参数中设置，单独修改prettier扩展的设置是无法解决这个问题的，因为perttier默认忽略了vue文件（事实上从忽略列表移除vue也不能解决这个问题）
  "vetur.format.defaultFormatterOptions": {
    "prettier": {
      "semi": false, // 格式化不加分号
      "singleQuote": true, // 格式化以单引号为主
      "trailingComma": "none" //是否最后一句话使用逗哈来结尾
    },
    "js-beautify-html": {
      // force-aligned | force-expand-multiline
      // "wrap_attributes": "force-aligned"
      "wrap_attributes": "auto"
    },
    "prettyhtml": {
      "printWidth": 100,
      "singleQuote": false,
      "wrapAttributes": false,
      "sortAttributes": true
    }
  },
  "workbench.editor.showTabs": true,
  // 别名路径跳转插件
  "alias-skip.mappings": {
    "@": "/src", // 默认只有`@`映射，映射到`/src`，你可以添加更多映射，映射路径必须以`/`开头
    // ...更多映射关系
    "~@/": "/src",
    "views": "/src/views",
    "assets": "/src/assets",
    "network": "/src/network",
    "common": "/src/common"
  },
  // "alias-skip.allowedsuffix": ["js","vue","jsx","ts"],  // 默认有这四项
  "alias-skip.rootpath": "package.json",
  "workbench.iconTheme": "vscode-icons",
  "svn.path": "D://Software//TortoiseSVN//bin",
  "editor.formatOnPaste": true,
  "bracketPairColorizer.depreciation-notice": false,
  "tabnine.experimentalAutoImports": true,
  "security.workspace.trust.untrustedFiles": "open",
  "bracket-pair-colorizer-2.depreciation-notice": false,
  "github.copilot.enable": {
    "*": true,
    "yaml": false,
    "plaintext": true,
    "markdown": false
  },
  "alignment.surroundSpace": {
    "colon": [0, 1],
    "assignment": [1, 1],
    "arrow": [1, 1],
    "comment": 2
  },
  "http.proxyAuthorization": null,
  "auto-close-tag.excludedTags": [
    "area",
    "base",
    "br",
    "col",
    "command",
    "embed",
    "hr",
    "img",
    "input",
    "keygen",
    "link",
    "meta",
    "param",
    "source",
    "track",
    "wbr"
  ],
  "editor.formatOnSave": true
}