prettier格式化配置

最新推荐文章于 2025-09-14 10:17:34 发布

原创最新推荐文章于 2025-09-14 10:17:34 发布 · 947 阅读

0 ·

CC 4.0 BY-SA版权

文章标签：

#javascript #前端 #vue.js #webstorm

文章详细介绍了如何在.prettierrc.js文件中设置代码格式化规则，包括单行长度、缩进、引号类型、括号空间等，以优化个人编程习惯。这些规则涵盖了printWidth、tabWidth、useTabs等多个关键配置项，旨在提高代码的可读性和一致性。

在.prettierrc.js中写入以下内容：

/此处的规则供参考，其中多半其实都是默认值，可以根据个人习惯改写
module.exports = {
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’, //对引用代码进行格式化。
}