/ Code Highlighting

Format code in GitHub comments with Prettier

Format code in GitHub comments with Prettier

Prettier GitHub

Format code in GitHub comments with Prettier.


GitHub app

This is the recommended and easiest installation method. Install the Prettier GitHub app to some or all of your repos.


  1. Deploy to now or Deploy to Heroku
  2. Setup
    1. Register a GitHub app
    2. Use whatever makes sense for you for App name, Description, Homepage URL and User authorization callback URL; leave Setup URL empty
    3. Set Webhook URL to your deployment URL, for example https://prettier-github.herokuapp.com/
    4. Set a Webhook secret and note it down
    5. Select Read & write access for Issues, Pull requests and Repository contents
    6. For Issues and Pull requests, check all Webhook checkboxes; for Repository contents, check only Commit comment
    7. Click on Create GitHub app
    8. Click on Generate private key and save the downloaded file
    9. Note down the app ID (displayed under your username in the right column)
  3. Configure environment variables of your deployment
    1. Set GITHUB_KEY to the downloaded private key
    2. Set GITHUB_ID to the app ID
    3. Set GITHUB_WEBHOOK_SECRET to the Webhook secret you configured


Whenever someone includes a JavaScript code block in a comment, it will be formatted using Prettier.

Before: Before

After: After

You can disable formatting per-comment by writing <!-- prettier-github disable --> anywhere in the comment (except code blocks)




A Nice collection of often useful examples done in HTML JavaScript CSS.

Read More