vscode prettier 格式化配置

在项目根目录下新建文件(.prettierrc) 将以下内容copy进去

{
  "printWidth": 300, // 一行代码的最大长度，超过这个长度会被折行，默认是 80
  "tabWidth": 2, // 一个 tab 代表的空格数，默认是 2
  "useTabs": false, // 是否使用 tab 符号进行缩进，默认是 false
  "semi": true, // 是否在语句末尾添加分号，默认是 true
  "singleQuote": true, // 是否使用单引号，默认是 true
  "jsxSingleQuote": false, // 在 JSX 中是否使用单引号，默认是 false
  "trailingComma": "es5", // 多行时是否在尾部添加逗号，可选值为 "es5" 或 "none"，默认是 "es5"
  "bracketSpacing": true, // 是否在对象的大括号之间添加空格，默认是 true
  "jsxBracketSpacing": true, // 是否在 JSX 的大括号之间添加空格，默认是 true
  "arrowParens": "avoid", // 箭头函数中如果只有一个参数是否添加括号，可选值为 "avoid" 或 "always"，默认是 "avoid"
  "requirePragma": false, // 是否要求在文件开头添加 `@format: on` 或 `// prettier-ignore`，默认是 false
  "insertPragma": false, // 是否在文件开头添加 `@format: on` 或 `// prettier-ignore`，默认是 false
  "proseWrap": "preserve", // 是否自动换行文档块（如 Markdown 的标题和列表），可选值为 "preserve" 或 "drop"，默认是 "preserve"
  "htmlWhitespaceSensitivity": "css", // HTML 中空白符的处理方式，可选值为 "css"、"敏感"、"insensitive"，默认是 "css"
  "endOfLine": "auto", // 行尾符的自动处理方式，可选值为 "auto"、"lf"、"crlf"，默认是 "auto"
  "jsx": { // JSX 的相关配置
    "reactFormatComments": false, // 是否开启 React 注释的格式化，默认是 false
    "sortProps": false, // 是否按照字母顺序排列 props，默认是 false
    "propListItemsLimit": 100, // 单行 props 的最大长度，超过这个长度会被折行显示，默认是 30
    "checkProps": false, // 是否检查 props 的类型和值，默认是 false
    "enforcePropAlignment": "none", // 是否强制对齐 props，可选值为 "none"、"align"、"force-align"，默认是 "none"
    "useShortCircuitingOperators": true, // 是否使用逻辑运算符代替三元表达式，默认是 true
    "useShorthandProperties": true, // 是否允许使用简写属性，默认是 true
    "specCompliant": true, // 是否符合 ES Proxy 的规范，默认是 true
    "useJSXTRANSITION": false, // 是否使用 JSX TRANSITION，默认是 false
    "checkJSXNames": false, // 检查 JSX 名称是否符合标准，默认是 false
    "noTrailingSpaces": true, // 是否禁止行尾空格，默认是 true
    "removeComments": false, // 是否删除多余的注释，默认是 false
    "semiColonSpacing": true, // 是否在分号和逗号之间添加空格，默认是 true
    "useParenthesesForArrowFunctions": true, // 在箭头函数中使用括号包裹参数，默认是 true
    "prohibitNullValues": true, // 是否禁止在 JSX 中使用 null 或 undefined 作为属性值，默认是 true
    "requireClosingBracket": "auto", // 在 JSX 中是否需要添加结束括号（如花括号、方括号、圆括号），可选值为 "auto"、"always"、"never"，默认是 "auto"
    "requireOpeningBracket": "auto", // 在 JSX 中是否
  }
}