Skip to content

Commit

Permalink
Enhance Documentation (#467)
Browse files Browse the repository at this point in the history
Co-authored-by: Shinigami92 <chrissi92@hotmail.de>
  • Loading branch information
Permanently and Shinigami92 committed Apr 22, 2024
1 parent 6a28a43 commit 4b13e6d
Show file tree
Hide file tree
Showing 2 changed files with 54 additions and 24 deletions.
21 changes: 19 additions & 2 deletions README.md
Original file line number Diff line number Diff line change
Expand Up @@ -62,6 +62,8 @@ pnpm add --save-dev prettier @prettier/plugin-pug

## Usage

### CLI

```bash
npx prettier --write "**/*.pug" --plugin="@prettier/plugin-pug"
# or
Expand All @@ -70,9 +72,24 @@ yarn prettier --write "**/*.pug" --plugin="@prettier/plugin-pug"
pnpm prettier --write "**/*.pug" --plugin="@prettier/plugin-pug"
```

## Configuration
### Configuration file (.prettierrc)

```json
{
"plugins": ["@prettier/plugin-pug"]
}
```

See [Standard Prettier overrides](https://prettier.github.io/plugin-pug/guide/standard-prettier-overrides.html) and [Pug specific options](https://prettier.github.io/plugin-pug/guide/pug-specific-options.html) for more options.

### API

See [documentation](https://prettier.github.io/plugin-pug/guide)
```js
await prettier.format('code', {
parser: 'pug',
plugins: ['@prettier/plugin-pug'],
});
```

## Workaround / Known Issue

Expand Down
57 changes: 35 additions & 22 deletions docs/guide/index.md
Original file line number Diff line number Diff line change
Expand Up @@ -22,6 +22,8 @@ yarn add --dev prettier @prettier/plugin-pug

## Usage

### CLI

Format all pug files in your project:

::: code-group
Expand All @@ -40,6 +42,39 @@ yarn prettier --write "**/*.pug" --plugin="@prettier/plugin-pug"

:::

### Configuration file

You can write your `.prettierrc.cjs` like this to get fully type check support with documentation:

```js
// @ts-check
/// <reference types="@prettier/plugin-pug/src/prettier" />

/**
* @type {import('prettier').Options}
*/
module.exports = {
plugins: ['@prettier/plugin-pug'],

printWidth: 120,
singleQuote: true,

pugSingleQuote: false,
// ... more pug* options
};
```

### API

Using the `plugins` option on the API, you can format .pug files:

```js
await prettier.format('code', {
parser: 'pug',
plugins: ['@prettier/plugin-pug'],
});
```

### Selectively ignoring automatic formatting

You can disable code formatting for a particular element by adding `//- prettier-ignore` comments in your pug templates:
Expand Down Expand Up @@ -82,25 +117,3 @@ Pug code with automatic formatting:
.text(color="primary", disabled)
```
````

## Type support in configuration file

You can write your `.prettierrc.cjs` like this to get fully type check support with documentation:

```js
// @ts-check
/// <reference types="@prettier/plugin-pug/src/prettier" />

/**
* @type {import('prettier').Options}
*/
module.exports = {
plugins: ['@prettier/plugin-pug'],

printWidth: 120,
singleQuote: true,

pugSingleQuote: false,
// ... more pug* options
};
```

0 comments on commit 4b13e6d

Please sign in to comment.