Mohammed Samgan Khan

Posted on Jun 24, 2022 • Updated on Jul 1, 2022 • Originally published at codebysamgan.com

How to Add Laravel Pint to VS Code Formatter

#laravel #laravelpint #vscode #formatter

What is laravel pint

as in the defination by the official repository,

Laravel Pint is an opinionated PHP code style fixer for minimalists. Pint is built on top of PHP-CS-Fixer and makes it simple to ensure that your code style stays clean and consistent.
-- laravel/pint

and as per me, Pint is the so far most sophisticated code formatter i have ever user in the reference of PHP. You can find more details about laravel/pint here.

Installation

composer require laravel/pint --dev

General Usage

to use the pint binary all you have to do is run the following command in the root of you laravel project.

./vendor/bin/pint

Configuration

The default setup of laravel pint does not require any configuration and as per the official docs, it for PSR-12 Style Guide. Still if you are unhappy with some default rules you can change then by creating a pint.json in root of your project, and adding the preset to it.

Currently the following preset are supported

psr12
laravel
symfony

Since Pint is based on PHP-CS-Fixer the configuration rules can be found here.

Sample pint.json

{
    "preset": "symfony",
    "rules": {
        "concat_space": {
            "spacing": "one"
        }
    }
}

Binding laravel pint with VS Code

So far we are good to use laravel/pint, but opening terminal and running a binary everytime you need to format id one hell of a job. To reduce that effort we will bind laravel/pint with our VS Code with the help of VS Code Task

Creating VS Code task for laravel pint

To create a task create a .vscode directory in rootof you project, if you don't have one.
Add a new file named as tasks.json to .vscode directory
add the following content to the new created file

{
    "version": "2.0.0",
    "tasks": [
        {
            "label": "Pint Formatter",
            "type": "shell",
            "command": "./vendor/bin/pint",
            "problemMatcher": [],
            "presentation": {
                "reveal": "silent"
            },
            "group": {
                "kind": "build",
                "isDefault": true
            }
        }
    ]
}

You can run this task directly from the Tremial -> Run Tasks from the navigation, but will do it a bit more simpler.

Adding KeyBinding (Keyboard Shortcut) to Run laravel pint

Open Keyboard shortcut panel, either from file -> preferences -> keyboard Shortcuts or Ctrl+k Ctrl+s
Ones open click on the file icon on the top to open the json file of the keyboard shortcuts.
Ones open add the following lines to the file.

[
  {
    "key": "ctrl+shift+l",
    "command": "workbench.action.tasks.runTask",
    "args": "Pint Formatter"
  }
]

Now all you have to do is hit Ctrl + Shift + l and your laravel project will formatted with laravel pint.

The Extension

If you are more driven toward the extension approach you can get the above integration by using the following extension.

Vscode Laravel Pint Extension

show some support bby staring the repo

Conclusion

I have been using the unsatisfactory formatters from a long time. All of them have one thing but lack other. Laravel Pint is one who has it all, combining it with vscode is like proving you laravel project a super power.

Feel free to pick your brain in comments.