What is stylelint-config-recommended?
The stylelint-config-recommended package is a shareable configuration for Stylelint, a popular CSS linter. It provides a set of recommended rules to help you enforce consistent and error-free CSS code. This package includes a basic set of rules that catch common errors and enforce best practices.
What are stylelint-config-recommended's main functionalities?
Basic Configuration
This feature allows you to extend the recommended configuration in your Stylelint configuration file. By doing so, you inherit a set of predefined rules that help maintain code quality and consistency.
{
"extends": "stylelint-config-recommended"
}
Catching Syntax Errors
This feature includes rules that catch common syntax errors such as empty blocks and invalid hex colors. These rules help prevent mistakes that could lead to broken or inconsistent styles.
{
"rules": {
"block-no-empty": true,
"color-no-invalid-hex": true
}
}
Enforcing Best Practices
This feature enforces best practices by including rules that prevent duplicate properties and font family names. These rules help ensure that your CSS is clean and maintainable.
{
"rules": {
"declaration-block-no-duplicate-properties": true,
"font-family-no-duplicate-names": true
}
}
Other packages similar to stylelint-config-recommended
stylelint-config-standard
The stylelint-config-standard package provides a more comprehensive set of rules compared to stylelint-config-recommended. It includes additional rules for stylistic issues and best practices, making it suitable for projects that require stricter code quality enforcement.
stylelint-config-sass-guidelines
The stylelint-config-sass-guidelines package is tailored for Sass projects and follows the guidelines set by Sass Guidelines. It includes rules specific to Sass syntax and best practices, making it a good choice for projects that use Sass.
stylelint-config-prettier
The stylelint-config-prettier package turns off all rules that are unnecessary or might conflict with Prettier, a code formatter. This package is useful if you want to use Stylelint for catching errors and Prettier for formatting.
stylelint-config-recommended
The recommended shareable config for stylelint.
It turns on all the possible errors rules within stylelint.
Use it as is or as a foundation for your own config.
Installation
npm install stylelint-config-recommended --save-dev
Usage
If you've installed stylelint-config-recommended
locally within your project, just set your stylelint
config to:
{
"extends": "stylelint-config-recommended"
}
If you've globally installed stylelint-config-recommended
using the -g
flag, then you'll need to use the absolute path to stylelint-config-recommended
in your config e.g.
{
"extends": "/absolute/path/to/stylelint-config-recommended"
}
Extending the config
Simply add a "rules"
key to your config, then add your overrides and additions there.
For example, to change the at-rule-no-unknown
rule to use its ignoreAtRules
option, turn off the block-no-empty
rule, and add the unit-whitelist
rule:
{
"extends": "stylelint-config-recommended",
"rules": {
"at-rule-no-unknown": [ true, {
"ignoreAtRules": [
"extends"
]
}],
"block-no-empty": null,
"unit-whitelist": ["em", "rem", "s"]
}
}