Prettier 开源项目教程
1. 项目的目录结构及介绍
Prettier 项目的目录结构如下:
prettier/
├── bin/
├── scripts/
├── src/
│ ├── languages/
│ ├── main/
│ ├── standalone/
│ └── utils/
├── tests/
├── docs/
├── website/
├── .editorconfig
├── .eslintignore
├── .eslintrc.json
├── .gitignore
├── .prettierrc.json
├── .prettierignore
├── .travis.yml
├── CONTRIBUTING.md
├── LICENSE
├── package.json
├── README.md
└── yarn.lock
目录介绍:
bin/
: 包含 Prettier 的可执行文件。scripts/
: 包含项目的脚本文件。src/
: 包含 Prettier 的核心源代码。languages/
: 支持的不同语言的解析器和打印器。main/
: 主程序入口。standalone/
: 独立版本的 Prettier。utils/
: 工具函数和辅助类。
tests/
: 包含测试文件。docs/
: 包含项目的文档。website/
: 包含 Prettier 官方网站的源代码。.editorconfig
: 编辑器配置文件。.eslintignore
: ESLint 忽略文件。.eslintrc.json
: ESLint 配置文件。.gitignore
: Git 忽略文件。.prettierrc.json
: Prettier 配置文件。.prettierignore
: Prettier 忽略文件。.travis.yml
: Travis CI 配置文件。CONTRIBUTING.md
: 贡献指南。LICENSE
: 项目许可证。package.json
: 项目依赖和脚本配置。README.md
: 项目介绍和使用说明。yarn.lock
: Yarn 锁定文件。
2. 项目的启动文件介绍
Prettier 的启动文件位于 bin/
目录下,主要文件是 prettier.js
。这个文件是 Prettier 的命令行接口(CLI)入口点。
#!/usr/bin/env node
const runPrettier = require("../src/cli/run-prettier.js");
runPrettier().catch(error => {
console.error(error);
process.exit(1);
});
这个文件负责调用 src/cli/run-prettier.js
中的函数来执行 Prettier 的格式化操作。
3. 项目的配置文件介绍
Prettier 的配置文件主要有以下几个:
.prettierrc.json
: 这是 Prettier 的主要配置文件,用于定义代码格式化的规则。
{
"printWidth": 80,
"tabWidth": 2,
"useTabs": false,
"semi": true,
"singleQuote": true,
"trailingComma": "es5",
"bracketSpacing": true,
"arrowParens": "always",
"proseWrap": "preserve"
}
.prettierignore
: 这个文件用于指定哪些文件或目录不需要被 Prettier 格式化。
node_modules
dist
package.json
: 在package.json
文件中,可以通过prettier
字段来配置 Prettier。
{
"prettier": {
"printWidth": 80,
"tabWidth": 2,
"useTabs": false,
"semi": true,
"singleQuote": true,
"trailingComma": "es5",
"bracketSpacing": true,
"arrowParens": "always",
"proseWrap": "preserve"
}
}
这些配置文件共同决定了 Prettier 如何格式化代码。