A Prettier plugin to sort CSS, SCSS or Less declarations based on their property names.
Using css-declaration-sorter under the hood.
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"]
}
This plugin adds two configurable keys to Prettier:
-
cssDeclarationSorterOrder
defaults toconcentric-css
. -
cssDeclarationSorterKeepOverrides
defaults totrue
, for a new codebasefalse
is recommended. -
cssDeclarationSorterCustomOrder
, an array of property names, their order is used to sort with. This overrides thecssDeclarationSorterOrder
option!