Prettier官方文档
Prettier是一个自定义的代码格式化工具,它支持以下文件格式:
- JavaScript,including ES2017
- JSX
- Angular
- Vue
- Flow
- Typescript
- CSS,Less and SCSS
- HTML
- JSON
- GraphQL
- Markdown,including GFM and MDX
- YAML
安装
yarn
yarn add prettier --dev --exact
## or globally
yarn global add prettier
npm
npm install --save-exact prettier
# or globally
npm install --global prettier
配置
Prettier提供了一套默认的配置,类似于eslint的自定义配置,它通过三种方法:
- 项目根目录下创建.prettierrc文件
- 项目根目录下创建prettier.config.js文件
- 在package.json文件中配置prettier属性
举例:
{
"tabWidth": 2, // tab缩进大小,默认为2
"useTabs": true, // 使用tab缩进,默认false
"semi": false, // 使用分号,默认true
"singleQuote": true, // 使用单引号,默认false(在jsx中配置无效,默认都是双引号)
"TrailingCooma": "none", // 行尾逗号,默认none,可选 none|es5|all,es5包括es5中的数组、对象,all包括函数对象等所有可选
"bracketSpacing": true, // 对象中的空格 默认false
"jsxBracketSameLine": false, // JSX标签闭合位置 默认false
"arrowParens": "avoid", // 箭头函数参数括号,默认avoid 可选avoid|always,avoid能省略括号的时候就省略 例如x => x,always总是有括号
}
忽略:
如果存在不想格式化的文件,可以忽略格式化。使用方式有两种:
- 项目根目录下创建.prettiergnore文件
- 代码注释
<div>
{/* prettier-ignore */}
<span ugly format='' />
</div>