stylelint-config-standard
Advanced tools
Package description
The stylelint-config-standard package is an extensible shared configuration for Stylelint, which is a mighty, modern linter that helps you avoid errors and enforce conventions in your styles. It is considered the standard configuration for Stylelint, providing a sensible default configuration that enforces common stylistic conventions for CSS.
Extensible Configuration
This package provides a base set of rules for Stylelint, which can be extended in a project's .stylelintrc configuration file. By extending stylelint-config-standard, you inherit a standard set of rules that can be customized further.
{
"extends": "stylelint-config-standard"
}Enforce Stylistic Conventions
The package enforces stylistic conventions such as lowercase hex colors, indentation levels, and leading zeros in numbers. These rules help maintain consistency across your project's stylesheets.
{
"rules": {
"color-hex-case": "lower",
"indentation": 2,
"number-leading-zero": "always"
}
}Customizable Rules
While it provides a standard set of rules, it also allows for customization. Developers can override or extend the rules to fit their project's specific needs, such as allowing certain at-rules that are not part of CSS specifications but are used by preprocessors.
{
"extends": "stylelint-config-standard",
"rules": {
"at-rule-no-unknown": [ true, {
"ignoreAtRules": ["extends", "ignores"]
}]
}
}This package is a lighter version of the standard configuration, focusing on possible error rules rather than stylistic rules. It's a good starting point for projects that want to enforce error checking without imposing stylistic choices.
This package extends stylelint-config-standard and adds rules specific to Sass, such as those for nesting depth, name formats, and other conventions. It's tailored for projects that use Sass and want to adhere to common guidelines.
This package integrates Stylelint with Prettier, an opinionated code formatter. It disables all rules that might conflict with Prettier, allowing developers to use Stylelint for linting and Prettier for formatting.
Changelog
36.0.0
stylelint less than 16.1.0 from peer dependencies.lightness-notation: "percentage" rule.Readme
The standard shareable config for Stylelint.
It extends stylelint-config-recommended and turns on additional rules to enforce modern conventions found in the CSS specifications.
To see the rules that this config uses, please read the config itself.
@import url("foo.css");
@import url("bar.css");
@custom-media --foo (min-width: 30em);
/**
* Multi-line comment
*/
:root {
--brand-red: hsl(5deg 10% 40%);
}
/* Single-line comment */
.class-foo:not(a, div) {
margin: 0;
top: calc(100% - 2rem);
}
/* Flush single line comment */
@media (width >= 60em) {
#id-bar {
/* Flush to parent comment */
--offset: 0px;
color: #fff;
font-family: Helvetica, "Arial Black", sans-serif;
left: calc(var(--offset) + 50%);
}
/* Flush nested single line comment */
a::after {
display: block;
content: "→";
background-image: url("x.svg");
}
}
@keyframes fade-in {
from {
opacity: 0;
}
to {
opacity: 1;
}
}
Note: the config is tested against this example, as such the example contains plenty of CSS syntax and features.
npm install stylelint-config-standard --save-dev
Set your Stylelint config to:
{
"extends": "stylelint-config-standard"
}
Add a "rules" key to your config, then add your overrides and additions there.
You can turn off rules by setting its value to null. For example:
{
"extends": "stylelint-config-standard",
"rules": {
"selector-class-pattern": null
}
}
Or lower the severity of a rule to a warning using the severity secondary option. For example:
{
"extends": "stylelint-config-standard",
"rules": {
"property-no-vendor-prefix": [
true,
{
"severity": "warning"
}
]
}
}
Or to add a rule, For example, the unit-allowed-list one:
{
"extends": "stylelint-config-standard",
"rules": {
"unit-allowed-list": ["em", "rem", "s"]
}
}
We recommend adding more of Stylelint's rules to your config as these rules need to be configured to suit your specific needs.
FAQs
Standard shareable config for Stylelint
The npm package stylelint-config-standard receives a total of 2,199,713 weekly downloads. As such, stylelint-config-standard popularity was classified as popular.
We found that stylelint-config-standard demonstrated a healthy version release cadence and project activity because the last version was released less than a year ago. It has 5 open source maintainers collaborating on the project.
Did you know?
Socket for GitHub automatically highlights issues in each pull request and monitors the health of all your open source dependencies. Discover the contents of your packages and block harmful activity before you install or update your dependencies.
Security News
As cyber threats become more autonomous, AI-powered defenses are crucial for businesses to stay ahead of attackers who can exploit software vulnerabilities at scale.
Security News
UnitedHealth Group disclosed that the ransomware attack on Change Healthcare compromised protected health information for millions in the U.S., with estimated costs to the company expected to reach $1 billion.
Security News
GitHub is susceptible to a CDN flaw that allows attackers to host malware on any public repository.