Prettier 是格式化代码工具。用来保持团队的项目风格统一。
安装
用 yarn
安装:
yarn add prettier --dev --exact
用 npm
安装:
npm install --save-dev --save-exact prettier
使用
代码变化后,自动进行代码格式化
按如下步骤做:
1 安装检查文件变化的的第三方包: onchange。
2 在 package.json
加如下内容:
"scripts": {
"prettier-watch": "onchange '**/*.js' -- prettier --write {{changed}}"
}
和 ESLint 配合使用
按如下步骤做:
1 安装第三方包:
代码语言:javascript复制yarn add eslint-config-prettier eslint-plugin-prettier --dev
2 在 .eslintrc.json
加如下内容:
{
"extends": ["prettier", "plugin:prettier/recommended"],
"plugins": ["prettier"],
"rules": {
"prettier/prettier": "error"
}
}
代码提交前,自动进行代码格式化
1 安装第三方包:
代码语言:javascript复制yarn add pretty-quick husky --dev
2 在 package.json
加如下内容:
{
"husky": {
"hooks": {
"pre-commit": "pretty-quick --staged"
}
}
}
更多代码提交的使用方法见这里。
配置规则
在 .prettierrc.js
中配置:
module.exports = {
trailingComma: "es5",
tabWidth: 4,
semi: false,
singleQuote: true
}
参数说明,见这里。
推荐用 prettier-standard 将代码格式化成 JavaScript 标准风格。
忽略文件
忽略文件, 在 .prettierrc.js
中配置
node_modules/
推荐阅读
- 相关项目
- 我为什么推荐Prettier来统一代码风格