MeekoPrettierOptions
interfaz Since 1.1.0
Opciones que el plugin añade a las de Prettier.
import type { MeekoPrettierOptions } from "@meekojs/meeko/prettier";Source code src/formatters/prettier/plugin.ts:37
Declaración #
interface MeekoPrettierOptions {
meekoIndentSections?: boolean
meekoPreserveArrayBreaks?: boolean
meekoSortClasses?: 'off' | 'stylesheet' | 'tailwind' | 'alphabetical'
meekoTailwindStylesheet?: string
meekoClassFunctions?: string[]
}Example #
// prettier.config.ts
import type { Config } from "prettier";
import type { MeekoPrettierOptions } from "@meekojs/meeko/prettier";
const config: Config & MeekoPrettierOptions = {
plugins: ["@meekojs/meeko/prettier"],
meekoIndentSections: true,
};
export default config;Propiedades #
meekoIndentSections
#
meekoIndentSections?: booleanIndenta un nivel el contenido de <script>, <script server>, <template> y <style>,
como vueIndentScriptAndStyle pero también en la plantilla. Por defecto false.
meekoPreserveArrayBreaks
#
meekoPreserveArrayBreaks?: booleanConserva expandido un array, un patrón de desestructuración o una tupla de TypeScript si en el
código fuente hay un salto de línea entre [ y su primer elemento, como objectWrap: "preserve" hace con los objetos; sin ese salto, Prettier decide como siempre. Para colapsarlo
basta con unir [ y el primer elemento. Se aplica a todo el JavaScript y TypeScript que
formatee Prettier con el plugin cargado, también a los archivos .ts y .js del proyecto.
Por defecto true; con false la salida es la de Prettier.
meekoSortClasses
#
meekoSortClasses?: 'off' | 'stylesheet' | 'tailwind' | 'alphabetical'Ordena las clases de cada atributo estático class="…" de la plantilla. Con "off" (por
defecto) conserva su orden; con "stylesheet", el de la primera aparición de cada clase en
app/styles/main.css procesada como en meeko dev (con el postcss.config del proyecto, sus
@import y sus @utilities) y, después, en el <style> del componente: las clases que no
aparecen en ninguno van primero, en su orden. Con "tailwind" (desde 1.8.0), el orden oficial
de Tailwind CSS 4, el mismo que prettier-plugin-tailwindcss, calculado con el design system
de la hoja meekoTailwindStylesheet y el tailwindcss instalado en el proyecto: las clases que
Tailwind no conoce van primero, en su orden. Con "alphabetical", por orden de código. Si la
hoja no existe o no se puede procesar (o, con "tailwind", si tailwindcss 4 no está
instalado), no se ordena y se avisa una vez. En un workspace no confiable de VS Code no se
aplica ni "stylesheet" ni "tailwind". En un atributo estático de un elemento, haya o no
orden, el valor se normaliza siempre: espacios colapsados y sin clases repetidas. Desde 1.8.0,
con un orden elegido también se aplica al class de una etiqueta de componente, a las cadenas
de bind:class y a las de meekoClassFunctions; con "off" esos valores no se tocan.
meekoTailwindStylesheet
#
meekoTailwindStylesheet?: stringHoja de entrada de Tailwind con la que meekoSortClasses: "tailwind" carga el design system
(sus @import, @theme, @plugin, @utility y @custom-variant), relativa a la raíz del
proyecto Meeko. Por defecto app/styles/main.css.
meekoClassFunctions
#
meekoClassFunctions?: string[]Funciones cuyas cadenas son listas de clases, como tailwindFunctions de
prettier-plugin-tailwindcss. Con un meekoSortClasses distinto de "off", ordena con ese modo
los literales de cadena de sus argumentos a cualquier profundidad (objetos, arrays, ternarios,
&&, ||, ??, +, plantillas de cadena), en cualquier JavaScript o TypeScript que formatee
Prettier con el plugin cargado: <script>, <script server>, expresiones de la plantilla y
archivos .ts, .tsx y .js. Las claves de un objeto, las comparaciones, el cuerpo de una
función y los argumentos de otra llamada no se tocan. Se comparan por nombre exacto, sin seguir
los import: tv o, para un miembro, styles.cn. Por defecto []: no ordena ninguna cadena.
See also #
- Formatting with Prettier Editores