@justeattakeaway/stylelint-config-pie NPM

stylelint-config-pie

PIE shareable stylelint config.

A Stylelint config used in PIE – Just Eat Takeaway’s design system.

Use it as is or as a foundation for your own config.

To see the rules that this config uses, please read the config itself.

Installation

npm install @justeattakeaway/stylelint-config-pie --save-dev

Usage

Rules

Currently there are 3 different sets of rules:

base - the base rules that we'd advise all projects use and extend as needed.
strict - a smaller collection of optional opinionated rules.
ordering - an even smaller collection of optional rules that specify the ordering of CSS properties.

In your projects

If you've installed stylelint-config-pie locally within your project, just set your stylelint config to:

{
  "extends": "@justeattakeaway/stylelint-config-pie/base"
}

The easiest way to do this is by adding the following section to your package.json:

"stylelint": {
  "extends": "@justeattakeaway/stylelint-config-pie/base"
}

You may only want to use a specific ruleset such as base, strict or ordering. If so, simply point to the ones you'd like to use:

"stylelint": {
  "extends": [
    "@justeattakeaway/stylelint-config-pie/base",
    "@justeattakeaway/stylelint-config-pie/strict",
    "@justeattakeaway/stylelint-config-pie/ordering"
  ]
}

Note: @justeattakeaway/stylelint-config-pie includes all rules. We would strongly recommend using @justeattakeaway/stylelint-config-pie/base and going from there.

If you've globally installed stylelint-config-pie using the -g flag, then you'll need to use the absolute path to stylelint-config-pie in your config e.g.

{
  "extends": "/absolute/path/to/@justeattakeaway/stylelint-config-pie/base"
}

Extending the config

Simply add a "rules" key to your config, then add your overrides and additions there.

For example, to change the indentation to tabs, and turn off the number-leading-zero rule:

{
  "extends": "@justeattakeaway/stylelint-config-pie/base",
  "rules": {
    "indentation": "tab",
    "number-leading-zero": null
  }
}

Documentation

Configured Lints

stylelint-config-pie is a great foundation for your own config. Here is a list of the rules turned on in this config, and what they do:

Base

Strict

Ordering

Changelog

PIE stylelint stylelint-config standard

@justeattakeaway/stylelint-no-logical-props-shorthands

@everything-registry/sub-chunk-505

0.0.0-snapshot-release-20241017150255

9 months ago

9 months ago

1 year ago

1 year ago

1 year ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago