prettier常用配置项

最新推荐文章于 2025-03-10 14:30:49 发布

Week.D.Awn

最新推荐文章于 2025-03-10 14:30:49 发布

阅读量2k

点赞数 1

分类专栏： vue 文章标签：前端格式化 prettier

本文链接：https://blog.youkuaiyun.com/weekdawn/article/details/126013893

版权

vue 专栏收录该内容

13 篇文章

订阅专栏

本文详细解读了Prettier配置的各个选项，包括tabWidth、printWidth、semicolons等，教你如何设置代码格式，确保代码整洁且易于阅读。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

常用配置

"tabWidth": 2,
"printWidth": 100,
"semi": true,
"singleQuote": true,
"arrowParens": "always",
"bracketSpacing": true,
"trailingComma": "all"

配置项详解

配置项	值	描述
tabWidth	2	缩进字节（2 空格代替 tab）
printWidth	100	屏幕显示宽度（一行做多容纳字节数，超过自动换行）
semi	true	句尾添加分号
singleQuote	false	启用单引号
arrowParens	always/avoid	箭头函数单一参数是否省略括号
bracketSpacing	true	对象，数组括号与文字之间加空格 { foo: bar }
trailingComma	all	对象或数组末尾加逗号

.prettierrc.js 配置

module.exports = {
  printWidth: 100,
  tabWidth: 2,
  semi: true,
  singleQuote: true,
  trailingComma: 'all',
  arrowParens: 'always',
  bracketSpacing: true,
};

.prettierignore 配置

# 忽略的文件夹:
build/
coverage/
.vscode/
docker/
node_modules/
.temp/

# 忽略的文件
*.html
*.js