Prettier Plugin for Twig/Melody

0.4.6 verified Sat Apr 25 auth: no javascript deprecated

A Prettier plugin that formats .twig, .html.twig, and .melody.twig files using the Melody parser. Version 0.4.6 is the latest stable release. It integrates with Prettier to provide consistent formatting for Twig templates used in Melody-based UI frameworks. Key differentiators include support for custom Twig extensions via twigMelodyPlugins, multi-tag handling (e.g., nav/endnav), and options to follow Symfony coding standards. It has several configuration options (twigSingleQuote, twigPrintWidth, twigAlwaysBreakObjects, etc.) but is not actively maintained (last release 2021, repository archived).

Common errors

error Cannot find module 'prettier-plugin-twig-melody' ↓

cause Plugin not installed or not in node_modules

fix

Run npm install --save-dev prettier prettier-plugin-twig-melody

error Error: No parser could be inferred for file: example.twig ↓

cause Prettier is not using the plugin to parse .twig files

fix

Add the plugin to the plugins array in .prettierrc or pass it via CLI with --plugin=prettier-plugin-twig-melody

error TypeError: Cannot read property 'type' of undefined ↓

cause Plugin cannot parse a malformed Twig template

fix

Check the Twig template for syntax errors or unsupported constructs. Ensure the template is valid Twig/Melody.

error Options were not applied: twigSingleQuote still false ↓

cause Options must be set in Prettier configuration file or passed correctly via API

fix

Add options to .prettierrc or pass them in the format call: prettier.format(code, { twigSingleQuote: true, plugins: [...] })

Warnings

deprecated This plugin is no longer maintained. The GitHub repository has been archived. ↓

fix Consider alternatives like @shopify/prettier-plugin-twig or prettier-plugin-twig (community fork).

gotcha The plugin must be explicitly added to the `plugins` array in .prettierrc for editor integration if not auto-loaded. ↓

fix Set plugins: ['./node_modules/prettier-plugin-twig-melody'] in your Prettier config.

gotcha When using the Prettier API, the plugin must be passed in the `plugins` array of the options object, not as a separate argument. ↓

fix Correct: prettier.format(code, { parser: 'twig', plugins: ['prettier-plugin-twig-melody'] })

gotcha The `twigMultiTags` option requires the order of tags to be correct: the opening tag first, the closing tag last, e.g., 'nav,endnav' not 'endnav,nav'. ↓

fix Ensure the string follows the pattern 'openingTag, ..., closingTag' with commas separating tags.

gotcha Node.js >=6 required. The plugin uses features not available in older Node versions. ↓

fix Upgrade Node.js to version 6 or later.

Install

npm install prettier-plugin-twig-melody

yarn add prettier-plugin-twig-melody

pnpm add prettier-plugin-twig-melody

Imports

plugin
wrong
```
import prettierPluginTwigMelody from 'prettier-plugin-twig-melody'
```
correct
```
Use via Prettier configuration: plugins: ["prettier-plugin-twig-melody"]
```
This is a Prettier plugin, not a library. It is loaded automatically or via the plugins array in .prettierrc. No direct import is needed.

options

wrong

Passing options via Prettier API without proper configuration

correct

Add options to .prettierrc: { "twigSingleQuote": true, "twigPrintWidth": 80 }

Options are set in Prettier configuration, not passed programmatically.

require with Prettier API

wrong

require('prettier-plugin-twig-melody') directly expecting a function

correct

const prettier = require('prettier'); prettier.format(code, { parser: 'twig', plugins: ['prettier-plugin-twig-melody'] })

The plugin is not a standalone module; it must be used through Prettier's format function with the plugin specified.

Quickstart

Demonstrates installing the plugin, formatting via CLI, and using the Prettier API with the plugin.

# Install
npm install --save-dev prettier prettier-plugin-twig-melody

# Format a .twig file via CLI
npx prettier --write "**/*.twig"

# Programmatic usage
const prettier = require('prettier');
const code = `{% for item in items %}
    <li>{{ item.name }}</li>
{% endfor %}`;
prettier.format(code, {
  parser: 'twig',
  plugins: ['prettier-plugin-twig-melody'],
  twigSingleQuote: true,
  twigPrintWidth: 80
}).then(result => console.log(result));