vue-desktop/PRETTIER_CONFIG_GUIDE.md

Prettier 常用配置项详解

基础格式化选项

semi (boolean)

• 默认值: true
• 说明: 在语句末尾打印分号
• 示例:
  • true: console.log('hello');
  • false: console.log('hello')

singleQuote (boolean)

• 默认值: false
• 说明: 使用单引号而不是双引号
• 示例:
  • true: const str = 'hello';
  • false: const str = "hello";

printWidth (number)

• 默认值: 80
• 说明: 指定每行代码的最大字符数，超过这个长度会自动换行

useTabs (boolean)

• 默认值: false
• 说明: 使用制表符(tab)缩进而不是空格

tabWidth (number)

• 默认值: 2
• 说明: 指定每个缩进级别的空格数

对象和数组格式化

bracketSpacing (boolean)

• 默认值: true
• 说明: 在对象字面量中的括号之间打印空格
• 示例:
  • true: { foo: bar }
  • false: {foo: bar}

bracketSameLine (boolean)

• 默认值: false
• 说明: 将多行 HTML 元素的 > 放在最后一行的末尾，而不是单独放在下一行

trailingComma (string)

• 默认值: "es5"

• 可选值: "none" | "es5" | "all"

• 说明: 在多行对象或数组的最后一个元素后是否添加逗号

• 示例:

  // "none"
  {
    foo: 'bar'
  }
  
  // "es5"
  {
    foo: 'bar',
  }
  
  // "all"
  {
    foo: 'bar',
    baz: 'qux',
  }
  

JSX 特定选项

jsxSingleQuote (boolean)

• 默认值: false
• 说明: 在 JSX 中使用单引号而不是双引号

singleAttributePerLine (boolean)

• 默认值: false
• 说明: 是否强制每个 JSX 属性独占一行

函数和箭头函数

arrowParens (string)

• 默认值: "always"

• 可选值: "always" | "avoid"

• 说明: 在箭头函数参数周围始终包含括号

• 示例:

  // "always"
  const fn = (x) => x
  
  // "avoid"
  const fn = (x) => x
  const fn2 = (x, y) => x + y
  

其他格式化选项

endOfLine (string)

• 默认值: "lf"
• 可选值: "auto" | "lf" | "crlf" | "cr"
• 说明: 指定换行符风格
  • "lf": \n (Linux/macOS)
  • "crlf": \r\n (Windows)

quoteProps (string)

• 默认值: "as-needed"
• 可选值: "as-needed" | "consistent" | "preserve"
• 说明: 对象属性引用方式
  • "as-needed": 仅在需要时才引用属性
  • "consistent": 如果至少有一个属性需要引用，则引用所有属性
  • "preserve": 保持原样

htmlWhitespaceSensitivity (string)

• 默认值: "css"
• 可选值: "css" | "strict" | "ignore"
• 说明: 指定 HTML、Vue、Angular 文件中全局空白敏感度

vueIndentScriptAndStyle (boolean)

• 默认值: false
• 说明: Vue 文件中单文件组件的脚本和样式标签内是否缩进