prettier-plugin-cpx

Prettier plugin for the CPX component template language.

Install

npm install --save-dev prettier-plugin-cpx
# or
yarn add -D prettier-plugin-cpx

Add to your .prettierrc:

{
  "plugins": ["prettier-plugin-cpx"]
}

What it does

• Sorts imports alphabetically by source path
• Breaks JSX attributes to one-per-line when they exceed printWidth, keeps them inline when they fit
• Puts the render expression on its own indented line below render
• Match arms one per line, body wraps to next line when too long
• Preserves string content — interpolated strings are never reformatted

Example

from "./LinkVariant.cpx" import { LinkVariant }
from "./LinkStruct.cpx" import { LinkStruct }

export component Link {
	content: slot
	link: LinkStruct
	variant: LinkVariant

	render
		match (variant) {
			LinkVariant.DEFAULT -> <a href={link.href}>{content}</a>,
			default -> <span>{content}</span>
		}
}