@suemor/prettier-config

A shareable Prettier configuration package for Suemor projects.

Installation

# npm
npm install --save-dev @suemor/prettier-config

# yarn
yarn add --dev @suemor/prettier-config

# pnpm
pnpm add --save-dev @suemor/prettier-config

Usage

Basic Usage

Create a .prettierrc.mjs file in your project root:

import config from '@suemor/prettier-config'

export default config

Custom Configuration

You can customize the configuration by using the defineConfig function:

import { defineConfig } from '@suemor/prettier-config'

export default defineConfig({
  // Override any base configuration options
  semi: true,
  // Control specific plugins
  importSort: true,
  tailwindcss: true,
  // Add custom plugins
  plugins: [
    // Add your custom plugins here
  ],
})

Tailwind CSS v4

Tailwind v4 uses a CSS-first configuration, so the class-sorting plugin needs to know your CSS entry point. Pass it via tailwindStylesheet:

import { defineConfig } from '@suemor/prettier-config'

export default defineConfig({
  tailwindcss: true,
  // Point to the CSS file that imports Tailwind and holds your theme/utilities
  tailwindStylesheet: './src/styles/app.css',
})

Without tailwindStylesheet, class sorting falls back to Tailwind's built-in default order and will not pick up your custom theme/utilities.

Features

This configuration includes:

• Sensible defaults for modern JavaScript/TypeScript projects
• Import sorting via @ianvs/prettier-plugin-sort-imports
• TailwindCSS class sorting via prettier-plugin-tailwindcss (supports Tailwind v4)
• Shell script formatting via prettier-plugin-sh
• Package.json formatting via prettier-plugin-package

Peer Dependencies

This package has the following peer dependencies:

prettier >= 3.7

You need to install these dependencies in your project:

# npm
npm install --save-dev prettier

# yarn
yarn add --dev prettier

# pnpm
pnpm add --save-dev prettier

Default Configuration

{
  tabWidth: 2,
  printWidth: 80,
  semi: false,
  singleQuote: true,
  trailingComma: 'all',
  arrowParens: 'always',
  endOfLine: 'lf',
}

Options

| Option | Type | Default | Description | | ------------- | ---------------------- | ------- | ---------------------------------------- | | importSort | boolean | true | Enable/disable import sorting | | tailwindcss | boolean | true | Enable/disable TailwindCSS class sorting | | tailwindStylesheet | string | undefined | Tailwind v4 CSS entry point (for correct class order) | | plugins | (string \| Plugin)[] | [] | Add custom plugins |

Plus all standard Prettier configuration options.

License

MIT