Ⅳ、Prettier - 工作中用到的规则

• *****1 - 创建.prettierrc.js配置

  • printWidth: 100——单行长度
  • tabWidth: 2——缩进长度
  • useTabs: false——使用空格代替tab缩进
  • semi: false——句末使用分号
  • singleQuote: true——使用单引号

  • quoteProps: '<as-needed|consistent|preserve>'——仅在必需时为对象的key添加引号

    • as-needed——仅在需要时在对象属性周围添加引号
    • consistent——如果对象中至少有一个属性需要用引号引起来，请用所有属性引起来
    • preserve——尊重对象属性中引号的输入使用
  • jsxSingleQuote: true——jsx中使用单引号

  • trailingComma: '<none|es5|all>'——多行时尽可能打印尾随逗号

    • none——没有尾随逗号
    • es5——在ES5中有效的结尾逗号（对象，数组等）
    • all——尽可能在结尾加上逗号（包括函数参数）。这需要节点8或转换
  • bracketSpacing: true——在对象文字中的括号之间打印空格-eg: { foo: bar }
  • jsxBracketSameLine: true——多属性html标签的‘>’折行放置

  • arrowParens: '<avoid|always>'——单参数箭头函数参数周围使用圆括号-eg: (x) => x

    • always——始终包含括号。例：(x) => x
    • avoid——如果可能的话，省去parens。例：x => x
  • requirePragma: false——无需顶部注释即可格式化
  • insertPragma: false——在已被preitter格式化的文件顶部加上标注
  • proseWrap: '<always|never|preserve>'——默认情况下，Prettier将按原样包装markdown文本，因为某些服务使用对换行敏感的渲染器，例如GitHub注释和BitBucket。在某些情况下，您可能希望改用编辑器/查看器软包装，因此此选项使您可以选择退出"never"

  • htmlWhitespaceSensitivity: '<css|strict|ignore>'——对HTML全局空白不敏感

    • css——遵守CSS display属性的默认值
    • strict——空白被认为是敏感的
    • ignore——空白被认为是不敏感的
  • vueIndentScriptAndStyle: false——不对vue中的script及style标签缩进

  • endOfLine: 'lf'——结束行形式

    • If

  • embeddedLanguageFormatting: 'auto'——对引用代码进行格式化

    • auto

• 2 - 创建.prettierignore配置

  • Ignore artifacts:——忽略目录

    • build
    • coverage

  • Ignore all HTML files:——忽略所有HTML文件

    • *.html