Show Topics

Custom Tools

Custom tools allow you to run shell commands to process files with tools not built into Prepros. Custom tools can be set to run after a file is compiled, this allows you to further process a file output by a built-in compiler. Custom tools can also be used with a custom File Type to compile files not supported by Prepros.

Run a custom tool after compiling a file.

This allows you to run a custom tool after a file is compiled.

For instance, if you want to run PurgeCSS after you compile a Sass file. Install PurgeCSS with NPM then go to Project Settings -> CSS Tools -> Sass then add the following custom command.

purgecss --css {{input}} --content "{{rawRootDir}}/**/*.html" --output {{outputDir}} {{output}}

Placeholders wrapped with double curly braces are replaced by Prepros with the actual path of the file when a file is compiled. When running custom command after compiling a file the {{input}} placeholder refers to the file output by the built-in compiler which is passed as an input to the command, not the initial source file.

PurgeCSS Note: {{output}} placeholder is required by Prepros but PurgeCSS doesn't support explicit output path so the {{output}} placeholder is ignored by PurgeCSS.

Custom File Types

This allows you to compile files not supported by Prepros. You can add a custom file type from Project Settings -> Custom Tools.

Available Placeholders

  • {{input}} — Quoted path of the input file.

  • {{rawInput}} — Unquoted path of the input file.

  • {{output}} — Quoted path of the output file.

  • {{rawOutput}} — Unquoted path of the output file.

  • {{inputDir}} — Quoted folder of the input file.

  • {{rawInputDir}} — Unquoted folder of the input file.

  • {{outputDir}} — Quoted folder of the output file.

  • {{rawOutputDir}} — Unquoted folder of the output file.

  • {{rootDir}} — Quoted path of the project folder.

  • {{rawRootDir}} — Unquoted path of the project folder.

  • {{inputName}} — Name of the input file.

  • {{rawInputName}} — Unquoted name of the input file.

  • {{outputName}} — Name of the output file.

  • {{rawOutputName}} — Unquoted name of the output file.