prettier-plugin-qingkuai

A Prettier plugin for formatting QingKuai (.qk) component files.

Features

• Formats QingKuai (.qk) template markup with consistent indentation and line breaks.
• Handles inline and block element wrapping rules based on CSS display semantics.
• Re-indents and formats embedded JS/TS expressions inside interpolation blocks.
• Keeps <script> and <style> block contents untouched.
• Supports Prettier's <!-- prettier-ignore --> comments.

Install

npm install --save-dev prettier prettier-plugin-qingkuai

Or with pnpm:

pnpm add -D prettier prettier-plugin-qingkuai

Usage

Add the plugin to your Prettier configuration:

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

Then run Prettier as usual:

npx prettier --write "**/*.qk"

Options

| Option | Type | Default | Description | | ------------------------------------ | -------------------- | --------- | --------------------------------------------------------------------------------------------------- | | spaceAroundInterpolation | boolean | false | Insert spaces at both ends of interpolation blocks. | | selfCloseEmptySlotTags | boolean | true | Convert empty slot tags to self-closing format, like <slot></slot> → <slot />. | | componentTagFormatPreference | "camel" \| "kebab" | "camel" | Preferred component tag format: <MyComponent> (camel) or <my-component> (kebab). | | componentAttributeFormatPreference | "camel" \| "kebab" | "camel" | Preferred component attribute format: MyCustomAttribute (camel) or my-custom-attribute (kebab). |

Development

# Build the plugin
pnpm build

# Run tests
pnpm test

License

MIT