* Move files around in preparation for refactor * Update paths in build script * Extract generic printing logic from the JavaScript printer * Conform printer API * Fixup decorator handling * Fix multiparser * Create plugin entry for markdown * Create plugin entry for javascript/typescript * Create plugin entry for html * Create plugin entry for graphql * Create plugin entry for css/less/scss * Move JSON to JS plugin entry * Integrate plugins into getSupportInfo() * Move astFormat to parser definition * Move util to common * Implement parser loading * remark -> mdast * Rename cli/cli -> cli/index * Rename builder -> doc package, fix printer resolution * Fix doc shape assumption in CSS-in-JS logic * Fix third-party.js prod resolution * Fixup build-docs script * Distribute multiparser code * Remove requirement to forward options * Flatten closure * Remove debug directory * Expose doc * Add external plugins * Pass options to loadPlugins * Export getParsers * Pin resolve version * Use getSupportInfo in Markdown embed * Document plugin API * Update build-docs * Add CLI for plugins * Lint docs * Fixup build.js * Add vue language * Fixup multiparser for vue * Upgrade rollup and rollup-plugin-commonjs * Fixup third-party build * Change AST format in docs
4.1 KiB
id, title
| id | title |
|---|---|
| plugins | Plugins |
IN DEVELOPMENT
The plugin API is unreleased and the API may change!
Plugins are ways of adding new languages to Prettier. Prettier's own implementations of all languages are expressed using the plugin API. The core prettier package contains JavaScript and other web-focussed languages built in. For additional languages you'll need to install a plugin.
Using Plugins
There are three ways to add plugins to Prettier:
- Via the CLI.
- Via the API.
- With a configuration file.
Configuration File (Recommended)
In your configuration file, add the plugins property:
{
"plugins": ["prettier-python"]
}
CLI
With the CLI, pass the --plugin flag:
prettier --write main.py --plugin prettier-python
Tip: You can pass multiple
--pluginflags.
Official Plugins
Developing Plugins
Prettier plugins are regular JavaScript modules with three exports, languages, parsers and printers.
languages
Languages is an array of language definitions that your plugin will contribute to Prettier. It can include all of the fields specified in prettier.getSupportInfo().
It must include name and parsers.
export const languages = [
{
// The language name
name: "InterpretedDanceScript",
// Parsers that can parse this language.
// This can be built-in parsers, or parsers you have contributed via this plugin.
parsers: ["dance-parse"]
}
];
parsers
Parsers convert code as a string into an AST.
The key must match the name in the parsers array from languages. The value contains a parse function and an AST format name.
export const parsers = {
"dance-parse": {
parse,
// The name of the AST that
astFormat: "dance-ast"
}
};
The signature of the parse function is:
function parse(text: string, parsers: object, options: object): AST;
printers
Printers convert ASTs into a Prettier intermediate representation, also known as a Doc.
The key must match the astFormat that the parser produces. The value contains an object with a print function and (optionally) an embed function.
export const printers = {
"dance-ast": {
print,
embed
}
};
Printing is a recursive process of coverting an AST node (represented by a path to that node) into a doc. The doc is constructed using the builder commands:
const { concat, join, line, ifBreak, group } = require("prettier").doc.builders;
The signature of the print function is:
function print(
// Path to the AST node to print
path: FastPath,
options: object,
// Recursively print a child node
print: (path: FastPath) => Doc
): Doc;
Check out prettier-python's printer as an example.
Embedding refers to printing one language inside another. Examples of this are CSS-in-JS and Markdown code blocks. Plugins can switch to alternate languages using the embed function. Its signature is:
function embed(
// Path to the current AST node
path: FastPath,
// Print a node with the current printer
print: (path: FastPath) => Doc,
// Parse and print some text using a different parser.
// You should set `options.parser` to specify which parser to use.
textToDoc: (text: string, options: object) => Doc,
// Current options
options: object
): Doc | null;
If you don't want to switch to a different parser, simply return null or undefined.
Testing Plugins
Since plugins can be resolved using relative paths, when working on one you can do:
const prettier = require("prettier");
const code = "(add 1 2)";
prettier.format(code, {
parser: "lisp",
plugins: ["."]
});
This will resolve a plugin relative to the current working direcrory.