Important: This documentation covers Yarn 1 (Classic).
For Yarn 2+ docs and migration guide, see yarnpkg.com.

Package detail

prettier-plugin-css-order

Siilwyn161.7kISC2.1.2

Sort CSS declarations in a certain order.

prettier, prettier-plugin, css, scss, less, declaration, sorter, property, order

readme

CSS Order Prettier Plugin

npm

A Prettier plugin to sort CSS, SCSS or Less declarations based on their property names.
Using css-declaration-sorter under the hood.

Usage

Following the Prettier plugin guidelines, this package depends on Prettier as a peer dependency:
npm install postcss prettier-plugin-css-order --save-dev

To enable the plugin use the Prettier API, CLI or configuration file. For example using the JS configuration:

{
  plugins: ["prettier-plugin-css-order"]
}

Configuration

This plugin adds two configurable keys to Prettier:

  • cssDeclarationSorterOrder defaults to concentric-css.
  • cssDeclarationSorterKeepOverrides defaults to true, for a new codebase false is recommended.
  • cssDeclarationSorterCustomOrder, an array of property names, their order is used to sort with. This overrides the cssDeclarationSorterOrder option!

changelog

Changelog

All notable changes to this project will be documented in this file. The format is based on Keep a Changelog and follows Semantic Versioning.

2.1.2 - 2024-04-01

Fixed

  • Bring back custom order feature introduced in 2.1.0.

2.1.1 - 2024-03-26

Fixed

  • Revert addition of new option because it breaks usage without.

2.1.0 - 2024-03-25

Added

  • New cssDeclarationSorterCustomOrder option to sort properties using an array in a custom order, thanks to @SavaCool122! ✨

2.0.1 - 2023-10-01

Fixed

  • Use latest css-declaration-sorter version.

2.0.0 - 2023-07-29

Changed

  • Options are prefixed with cssDeclarationSorter, so order becomes cssDeclarationSorterOrder and keepOverrides becomes cssDeclarationSorterKeepOverrides.
  • Uses Prettier 3 with faster async parsing and less dependencies! 🎉 Thanks to @ubermanu for the initial changes.

    Removed

  • Node.js 14 support.

1.3.1 - 2023-06-08

Fixed

  • Sorting properties mixed with comments.

1.3.0 - 2022-07-25

Added

  • Support for Less syntax using the PostCSS Less parser.

1.2.0 - 2022-04-09

Added

1.1.0 - 2022-01-08

Added

  • Support for new SCSS comment syntax using the PostCSS SCSS parser.

1.0.0 - 2021-07-27

Initial release.