Prettier Action 使用教程
项目介绍
prettier_action
是一个 GitHub Action,用于在项目中自动运行 Prettier 代码格式化工具。Prettier 是一个流行的代码格式化工具,支持多种编程语言,能够确保代码风格的一致性。prettier_action
使得在 GitHub 仓库中集成 Prettier 变得更加简单和自动化。
项目快速启动
步骤 1: 创建 GitHub Actions 工作流文件
在你的 GitHub 仓库中,创建一个 .github/workflows
目录(如果该目录不存在),然后在该目录下创建一个 YAML 文件,例如 prettier.yml
。
步骤 2: 配置工作流文件
将以下内容复制到 prettier.yml
文件中:
name: Format Codebase with Prettier
on:
pull_request:
push:
branches:
- main
jobs:
prettier:
runs-on: ubuntu-latest
steps:
- uses: actions/checkout@v4
with:
ref: ${{ github.head_ref }}
fetch-depth: 0
- uses: actions/setup-node@v4
with:
node-version: '20'
- uses: pnpm/action-setup@v3
with:
version: '8'
run_install: false
standalone: true
dest: /toolcache
- name: Install dependencies
run: pnpm install
- name: Run Prettier
uses: creyD/[email protected]
with:
prettier_options: '--write **/*.{js,ts,jsx,tsx,css}'
prettier_plugins: 'prettier-plugin-tailwindcss'
步骤 3: 提交并推送配置文件
将 prettier.yml
文件提交到你的 GitHub 仓库,并推送到 main
分支。
应用案例和最佳实践
应用案例
- 前端项目: 在一个使用 React 和 Tailwind CSS 的前端项目中,使用
prettier_action
自动格式化 JavaScript、JSX 和 CSS 文件。 - 后端项目: 在一个 Node.js 后端项目中,使用
prettier_action
自动格式化 TypeScript 文件。
最佳实践
- 配置文件: 确保你的项目中有一个
.prettierrc
配置文件,以便prettier_action
能够按照你的项目风格进行格式化。 - 自动化: 将
prettier_action
配置为在每次push
和pull_request
时运行,以确保代码提交前已经格式化。
典型生态项目
- ESLint: 结合 ESLint 使用,可以在代码格式化和代码质量检查方面提供全面的解决方案。
- Husky: 使用 Husky 在本地开发时自动运行 Prettier,确保在提交代码前进行格式化。
通过以上步骤和配置,你可以轻松地在你的 GitHub 项目中集成 prettier_action
,实现代码的自动格式化。