rule : Options -> Review.Rule.Rule
Reports if a css class string does not adhere to the recommended class order
config =
[ TailwindCss.ConsistentClassOrder.rule { order = classOrder, checkedFunctions = [checkClassFunction] }
]
It is not recommended to define the `order` option manually. Instead you can use the [postcss-plugin](https://www.npmjs.com/package/elm-review-tailwindcss-postcss-plugin)
to generate the Elm code for you and then you can just import the `classOrder` in your `ReviewConfig.elm` file.
a =
class "flex absolute"
a =
class "absolute flex"
This rule is useful when you are using tailwindcss and the recommended class order helps you read and understand the code faster. This rule is not useful when you are not using tailwindcss, you do not care in which order the classes are, or you disagree with the recommended order.
You can try this rule out by adding the postcss-plugin to your postcss.config.js and running the following command:
elm-review --template anmolitor/elm-review-tailwindcss/example --rules TailwindCss.ConsistentClassOrder
Executing postcss (via your bundler for example) should generate the needed files in your /review directory so that the template compiles.
{ order : Dict String Basics.Int
, checkedFunctions : List TailwindCss.CheckedFunction.CheckedFunction
}
Options for the ConsistentClassOrder rule.
order: should be generated from the postcss plugin
checkedFunctions: a list of function calls to check for consistent class order
defaultOptions : { order : Dict String Basics.Int } -> Options
Provide required options and defaults the other options