Prettier is an opinionated code formatter
属性配置：https://prettier.io/docs/en/options.html
npm install --save-dev prettier
示例
// src/index.js function foo(a,b){return a+b}
格式化代码文件输出到命令行
$ npx prettier src/index.js // src/index.js function foo(a, b) { return a + b; }
格式化文件并覆盖现有文件
npx prettier --write src/index.js
示例2：
// src/index.js function foo(a,b){return a+b} function func(){console.log("Hello World");} $ npx prettier src/index.js // src/index.js function foo(a, b) { return a + b; } function func() { console.log("Hello World"); }
默认情况下
- 行首2个空格
- 句尾分号
- 变量之间增加空格
- 使用双引号
使用配置文件
// prettier.config.js or .prettierrc.js module.exports = { // 在对象或数组最后一个元素后面加逗号 trailingComma: 'es5', // 空格形式缩进2空格 tabWidth: 2, // 结尾不用分号 semi: false, // 使用单引号 singleQuote: true, // html中单属性换行 singleAttributePerLine: true, };
再次格式化
$ npx prettier src/index.js // src/index.js function foo(a, b) { return a + b } function func() { console.log('Hello World') }
还可以配合.editorconfig一起使用
[*]
charset = utf-8
insert_final_newline = true
end_of_line = lf
indent_style = space
indent_size = 2
max_line_length = 80
VS Code中安装插件Prettier - Code formatter
也可以使用目录中的配置文件
