Sass-Konfiguration for stylelint
Diese Konfiguration basiert auf sass-guidelin.es
Zurück zur englischen Version
$ npm i -D stylelint stylelint-config-sass-guidelines
Füge diese Zeile in deine stylelint-Konfiguration hinzu:
{
"extends": "stylelint-config-sass-guidelines"
}
Füge "rules"
in dein Konfiguration hinzu. Und überschreibe dann Regel innerhalb von "rules"
.
Zum Beispiel kannst du mit indentation
Tabs aktivieren und die Regel number-leading-zero
deaktivieren.
{
"extends": "stylelint-config-sass-guidelines",
"rules": {
"indentation": "tab",
"number-leading-zero": null
}
}
stylelint-order
: Eine Erweiterung die Regel CSS-Eigenschaft sortiert.stylelint-scss
: Eine Sammlung von SCSS-speziefischen Regeln für stylelint.
Hier findest du eine Liste mit den voreingestellten Regel und was sie bewirken.
at-rule-disallowed-list
: Erstellt eine list für unerwünschte at-Regeln."debug"
Verbiete das Benutzen von@debug
.
at-rule-no-vendor-prefix
: Verbiete fremde Präfixe für at-Regeln.
block-no-empty
: Verbiete leere Blöcke.block-opening-brace-space-before
: Es muss immer ein Leerzeichen vor einer öffnenden Klammer sein.
color-hex-case
: Hex-Farben müssen klein geschrieben werden.color-hex-length
: Wenn möglich, nutzen verkürtze Hex-Werte.color-named
: Farben dürfen nicht benannt werden.color-no-invalid-hex
: Hex-Farben müssen valide Werte sein.
declaration-bang-space-after
: Es darf kein Leerzeichen vor dem Ausrufezeichen sein.declaration-bang-space-before
: Es muss immer ein Leerzeichen vor dem Ausrufezeichen sein.declaration-colon-space-after
: Wenn der Wert der Eigenschaft ein Zeile lang ist muss ein Leerzeichen nach dem Doppelpunkt sein.declaration-colon-space-before
: Es darf kein Leerzeichen vor der Doppelpunkt sein.
declaration-block-properties-order
: Eigenschaft in Blöcken müssen alphabetisch sortiert werden.declaration-block-semicolon-newline-after
: Es muss immer eine neue Zeile nach einem Semikolon anfangen.declaration-block-semicolon-space-before
: Es darf kein Leerzeichen vor dem Semikolon sein.declaration-block-single-line-max-declarations
: Es darf nich mehr als eine Eigenschaft in einer Zeile sein.declaration-block-trailing-semicolon
: Es muss immer ein Semikolon nach einer Eigenschaft kommen.
declaration-property-value-disallowed-list
: Verbiete bestimmte Eigenschaften- und Werte-Paare in einer Deklaration^border
: Verbiete das Nutzen vonnone
für Borders, nutze0
lieber.
function-comma-space-after
: Es muss immer ein Leerzeichen nach dem Komma in einzeiligen Fuktionen sein.function-parentheses-space-inside
: Es darf kein Leerzeichen in den Klammern einer Funktion sein.function-url-quotes
: URLs müssen immer von Anführungzeichen umgeben sein.
indentation
: Die Einrückung muss immer2
Leerzeichen groß sein.length-zero-no-unit
: Verbiete Einheiten bei Werten mit dem Wert0
.max-nesting-depth
: Limitiert die Verschachtelungstiefe auf1
. Wird ignoriert bei@media
,@supports
, und@include
.no-missing-eof-newline
: Es muss sich am Ende der Datei eine neue leere Zeile befinden.
media-feature-name-no-vendor-prefix
: Verbiete fremde Präfixe für Medienfeaturenamen.
number-leading-zero
: Verbiete Werte wie.5
und nutze lieber0.5
.number-no-trailing-zeros
: Verbiete unnötige Nullen am Ende von Werten.
property-no-vendor-prefix
: Verbiete fremde Präfixe für Eigenschaften.shorthand-property-no-redundant-values
: Verbiete überflüssige Werte in verkürtzen Eigenschaften.
rule-nested-empty-line-before
: Es muss immer eine leere Zeile vor jeder mehrzeiligen Regel geben. Außer bei verschachtelte Selektoren die die erste von dem Eltern-Selektor ist. Igniert Regeln die nach einem Kommentar kommen.rule-non-nested-empty-line-before
: Vor jeder mehrzeiligen Regel muss es eine leere Zeile geben. Ignoriert wenn die Regel nach einem Kommenter kommt.
at-extend-no-missing-placeholder
: Verbiete at-extends (@extend
) mit fehlendem Platzhalter.at-function-pattern
: SCSS Funktionen müssen klein geschrieben werden und diesem Regex entsprechen^[a-z]+([a-z0-9-]+[a-z0-9]+)?$
.at-import-no-partial-leading-underscore
: Verbiete führende Unterstriche in partiellen Namen bei@import
.at-import-partial-extension-blacklist
: Erstellt eine list von verbotenen Dateiendungen für partiellen name beim importieren..scss
: Verbiete das Nutzen von.scss
Dateiendungen beim importieren.
at-mixin-pattern
: SCSS Mixins müssen klein geschrieben werden und diesem Regex entsprechen^[a-z]+([a-z0-9-]+[a-z0-9]+)?$
.dollar-variable-colon-space-after
: Benötigt ein Leerzeichen nach dem Doppelpunkt bei der $-variable Deklaration.dollar-variable-colon-space-before
: Verbiete Leerzeichen vor dem Doppelpunkt bei der $-variable Deklaration.dollar-variable-pattern
: SCSS Variablen müssen klein geschrieben werden und diesem Regex entsprechen^[a-z]+([a-z0-9-]+[a-z0-9]+)?$
.percent-placeholder-pattern
: SCSS%
-Platzhalter klein geschrieben werden und diesem Regex entsprechen^[a-z]+([a-z0-9-]+[a-z0-9]+)?$
.selector-no-redundant-nesting-selector
: Verbiete unnötiges verschachteln von Selektoren (&
).
selector-class-pattern
: Selektoren müssen klein geschrieben werden und dem Regex entsprechen^(?:u|is|has)-[a-z][a-zA-Z0-9]*$|^(?!u|is|has)[a-zA-Z][a-zA-Z0-9]*(?:-[a-z][a-zA-Z0-9]*)?(?:--[a-z][a-zA-Z0-9]*)?$
.selector-list-comma-newline-after
: Es muss nach jedem Selektir immer eine neue Zeile angefangen werden bei einer Selektoreliste.selector-max-compound-selectors
: Limitiert die Anzal der zusammengesetzten Selektoren auf3
.selector-no-id
: Verbiete ID-Selektoren.selector-no-qualifying-type
: Verbiete qualifizierende Selektoren nach Typ.selector-no-vendor-prefix
: Verbiete fremde Präfixe for Selektoren.selector-pseudo-element-colon-notation
: Anwendbare Pseudo-Elemente müssen die zwei Doppelpunkt-Schreibweise verwenden.selector-pseudo-element-no-unknown
: Verbiete unbekannte Pseudo-Element-Selektoren.
string-quotes
: Strings müssen immer von einfachen Anführungszeichen umgeben sein.
stylelint-disable-reason
: Benötigt ein Begründungskommentart vor einem stylelint-disable Kommentar.
value-no-vendor-prefix
: Verbiete fremde Präfixe für Werte.