Enhance Documentation (#467)

Co-authored-by: Shinigami92 <chrissi92@hotmail.de>

Author: Permanently

README.md

@@ -62,6 +62,8 @@ pnpm add --save-dev prettier @prettier/plugin-pug
 
 ## Usage
 
+### CLI
+
 ```bash
 npx prettier --write "**/*.pug" --plugin="@prettier/plugin-pug"
 # or
@@ -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
 

docs/guide/index.md

@@ -22,6 +22,8 @@ yarn add --dev prettier @prettier/plugin-pug
 
 ## Usage
 
+### CLI
+
 Format all pug files in your project:
 
 ::: code-group
@@ -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:
@@ -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
-};
-```