Preitter代码格式化

配置

1.安装 npm i prettier -D

2.配置文件 项目根目录新建配置文件 .prettierrc

3.配置 .prettierrc

{
  printWidth: 80, //单行长度
  tabWidth: 2, //缩进长度
  useTabs: false, //使用空格代替tab缩进
  semi: true, //句末使用分号
  singleQuote: true, //使用单引号
  quoteProps: 'as-needed', //仅在必需时为对象的key添加引号
  jsxSingleQuote: true, // jsx中使用单引号
  trailingComma: 'all', //多行时尽可能打印尾随逗号
  bracketSpacing: true, //在对象前后添加空格-eg: { foo: bar }
  jsxBracketSameLine: true, //多属性html标签的‘>’折行放置
  arrowParens: 'always', //单参数箭头函数参数周围使用圆括号-eg: (x) => x
  requirePragma: false, //无需顶部注释即可格式化
  insertPragma: false, //在已被preitter格式化的文件顶部加上标注
  proseWrap: 'preserve', //不知道怎么翻译
  htmlWhitespaceSensitivity: 'ignore', //对HTML全局空白不敏感
  vueIndentScriptAndStyle: false, //不对vue中的script及style标签缩进
  endOfLine: 'lf', //结束行形式
  embeddedLanguageFormatting: 'auto', //对引用代码进行格式化
}

4.如果某些类型文件需要跳过格式化，则可配置忽略文件 .prettierignore 5.配置.prettierignore

# Ignore artifacts:
build
coverage

# Ignore all HTML files:
*.html

使用

1.格式化全部

npx prettier --write .

2.格式化指定文档

npx prettier --write src/components/Button.js

3.检查是否已经格式化

npx prettier --check .