Prettier Pug plugin
Please note that the plugin ecosystem in Prettier is still beta, which may make prettier-plugin-pug
not ready for production use yet.
Plugin for Prettier to format pug code
You can disable code formatting for a particular code block by adding <!-- prettier-ignore -->
before ```pug
.
Pug code with custom formatting:
<!-- prettier-ignore -->
```pug
div.text( color = "primary", disabled ="true" )
```
Prettified code:
```pug
.text(color="primary", disabled)
```
Getting started
Simply install prettier
and prettier-plugin-pug
as your project’s npm dependencies:
cd /path/to/project
npm init
yarn init
npm install --dev prettier prettier-plugin-pug
yarn add --dev prettier prettier-plugin-pug
Usage
./node_modules/.bin/prettier --write "**/*.pug"
yarn prettier --write "**/*.pug"
Integration with editors
If you are using a text editor that supports Prettier integration (e.g. Atom), you can have all Prettier perks for your Pug code too!
Use of this plugin in VSCode extension seems to be blocked by prettier/prettier-vscode#395.
Feel free to help!
In order to get prettier-plugin-pug
working in projects that do not have local npm dependencies, you can install this plugin globally:
npm install --global prettier prettier-plugin-pug
In this case, you might need to check the settings of your editor’s Prettier extension to make sure that a globally installed Prettier is used when it is not found in project dependencies (i.e. package.json
).
Nevertheless, it is recommended to rely on local copies of prettier
and prettier-plugin-pug
as this reduces the chance of formatting conflicts between project collaborators.
This may happen if different global versions of Prettier or its Pug plugin are used.
Installing prettier-plugin-pug
either locally or globally may require you to restart the editor if formatting does not work right away.
Implementation details
This plugin is written in TypeScript and its quality is maintained using Prettier and Jest.
Contributing
If you’re interested in contributing to the development of Prettier for Pug, you can follow the CONTRIBUTING guide from Prettier, as it all applies to this repository too.
To run prettier-plugin-pug
locally:
- Clone this repository.
- Execute
yarn install
. - Execute
yarn lint
to make sure that the code passes formatting and linting. - Execute
yarn test
to make sure that TypeScript successfully compiles into JavaScript and and all unit tests pass.
Credits
This project was inspired by https://github.com/gicentre/prettier-plugin-elm.