mikaela.github.io/n/prettier.md

{{ page.excerpt }}

Automaattinen sisällysluettelo / Automatically generated Table of Contents

• The packages
• Installation
• Configuration
• .pre-commit-config.yaml
  • Offline
  • Online
• Further information

The packages

• prettier
• prettier-plugin-nginx
• @prettier/plugin-ruby
• prettier-plugin-toml
• @prettier/plugin-xml
• prettier-plugin-sh

Installation

1. npm install -D -E prettier@3.3.1 prettier-plugin-nginx@1.0.3 @prettier/plugin-ruby@4.0.4 prettier-plugin-toml@2.0.1 @prettier/plugin-xml@3.4.1 prettier-plugin-sh@0.14.0 or probably just pnpm install -D if it’s not your project.
2. If they don’t exist already echo "{}" > .prettierrc && touch .prettierignore
3. pnpm exec prettier . --write or pnpm exec prettier . --check

Configuration

I do with .editorconfig what I can, but for example this site’s .prettierrc looks like:

{
  "plugins": ["@prettier/plugin-xml"],
  "overrides": [{ "files": ".prettierrc", "options": { "parser": "json" } }]
}

at the time of writing. It’s directly from documentation excluding the plugin name, but I will want it everywhere.

.pre-commit-config.yaml

This is the file that controls pre-commits behaviour.

Offline

I accidentally wrote this while updating this page to reflect me using prettier outside of pre-commit too nowadays. This has the advantage that the same local environment gets reused and dependencies are managed centrally, but assumes everyone uses pnpm, won’t work in pre-commit ci and may have other issues I am not thinking of as a not-coder myself.

ci:
  skip: [pnpm-prettier]
repos:
  - repo: local
    hooks:
      - id: pnpm-prettier
        name: prettier
        entry: pnpm exec prettier --cache --ignore-unknown --write
        language: system
        # Better handled by pretty-format-json from pre-commit-hooks.
        # Remember to have *.json in .prettierignore!
        exclude_types: [json]

Online

repos:
  #- repo: https://github.com/pre-commit/mirrors-prettier
  - repo: https://github.com/rbubley/mirrors-prettier
    rev: "v3.3.1"
    hooks:
      - id: prettier
        # Better handled by pretty-format-json from pre-commit-hooks.
        # Remember to have *.json in .prettierignore!
        exclude_types: [json]
        additional_dependencies: [
            # https://aminda.eu/n/prettier
            "prettier@3.3.1",
            "prettier-plugin-nginx@1.0.3",
            "@prettier/plugin-ruby@4.0.4",
            "prettier-plugin-toml@2.0.1",
            "@prettier/plugin-xml@3.4.1",
          ]

Further information

• prettier docs install