Running Prettier as a Zeus Auto-save Trigger

[jussij]

What is Prettier?
Prettier is an opinionated code formatter with support for several programming languages. More details can be found here.

For details on how to install Prettier and have it work with Zeus refer to this earlier link: viewtopic.php?p=13199

Using Prettier as a Zeus Auto-save Trigger
The installation from the earlier link details how to run Prettier as a tool using the menu or the keyboard.

However, Prettier can also be run as a Zeus trigger, meaning it will run every time the file is saved.

To make this happen, edit the document type and add the following line of code to the save and save as postfix triggers:

Code: Select all

$zud\zScript\prettier_fmt.lua

Example: Setting up a Prettier TypeScript Trigger
For example, the image below shows how the Options, Document Types menu was used to edit the TypeScript Document Type and in the Triggers panel the Prettier command lines were added to those events as shown below:

ts-prettier.png (98.27 KiB) Viewed 3858 times

With those triggers in place, the Zeus Prettier macro is triggered every time the file is saved and that will then run the following command line:

Code: Select all

npx --quiet prettier --write --loglevel silent --no-config $fn

NOTE: The $fn in that command line is replaced with the name of the file being saved. To change this command line just edit the prettier_fmt.lua macro trigger and change it to suit.

IMPORTANT: If the following error is produced, that means node.js has not been installed or the node.exe is not found in the system PATH:

Code: Select all

"node" is not recognized as an internal or external command,
operable program or batch file.

To fix this just make sure node.js is installed and make sure the node.exe installation folder is found in the PATH using the instructions found here: viewtopic.php?t=6176

With the everything working as expected, and the following test.ts TypeScript file looking as follows:

ts_before.png (4.34 KiB) Viewed 3858 times

When this file is saved, it will be automatically reformatted by Prettier to look like this:

ts_after.png (5.94 KiB) Viewed 3858 times

Cheers Jussi