stylelint-config-prettier

What is stylelint-config-prettier?

The stylelint-config-prettier package is a configuration for Stylelint that disables all rules that are unnecessary or might conflict with Prettier. This allows you to use Stylelint for CSS linting and Prettier for code formatting without conflicts.

What are stylelint-config-prettier's main functionalities?

Disabling conflicting rules

By extending 'stylelint-config-prettier' in your Stylelint configuration, you disable all rules that might conflict with Prettier. This ensures that Prettier can handle code formatting while Stylelint focuses on linting.

{
  "extends": [
    "stylelint-config-prettier"
  ]
}

Combining with other configurations

You can combine 'stylelint-config-prettier' with other Stylelint configurations like 'stylelint-config-standard'. This allows you to use a standard set of linting rules while still avoiding conflicts with Prettier.

{
  "extends": [
    "stylelint-config-standard",
    "stylelint-config-prettier"
  ]
}

Other packages similar to stylelint-config-prettier

eslint-config-prettier

eslint-config-prettier is a similar package for ESLint that turns off all rules that are unnecessary or might conflict with Prettier. It serves the same purpose as stylelint-config-prettier but for JavaScript and other languages supported by ESLint.

tslint-config-prettier

tslint-config-prettier is a configuration for TSLint that disables all rules that are unnecessary or might conflict with Prettier. It is similar to stylelint-config-prettier but is used for TypeScript linting.

prettier-stylelint

prettier-stylelint is a package that formats your styles using Prettier followed by Stylelint --fix. It integrates both tools to ensure your styles are both formatted and linted correctly.

README

stylelint-config-prettier

Note
As of Stylelint v15 all style-related rules have been deprecated. If you are using v15 or higher and are not making use of these deprecated rules, this plugin is no longer necessary.

Turns off all rules that are unnecessary or might conflict with Prettier. This lets you use your favorite shareable config without letting its stylistic choices get in the way when using Prettier.

Installation

Install stylelint-config-prettier:

npm install --save-dev stylelint-config-prettier

Then, append stylelint-config-prettier to the extends array in your .stylelintrc.* file. Make sure to put it last, so it will override other configs.

{
  "extends": [
    // other configs ...
    "stylelint-config-prettier"
  ]
}

CLI helper tool

stylelint-config-prettier is shipped with a little CLI tool to help you check if your configuration contains any rules that are in conflict with Prettier.

In order to execute the CLI tool, first add a script for it to package.json:

{
  "scripts": {
    "stylelint-check": "stylelint-config-prettier-check"
  }
}

Then run npm run stylelint-check.

Attribution

• Inspired by eslint-config-prettier.
• CLI helper inspired by tslint-config-prettier.
• Original disabled ruleset copied from prettier-stylelint.

---

MIT