@studiohyperdrive/stylelint-config/lib/sass.js

Studio Hyperdrive StyleLint linting rules/guidelines.

// StyleLint Sass configuration
// ---
// https://www.npmjs.com/package/stylelint-scss
// -------------------------------------------------------------------------- /

module.exports = {
	plugins: [
		"stylelint-scss",
		"stylelint-declaration-use-variable",
	],
	rules: {

		// Default Stylelint
		// ------------------------------------------------------------------------ /

		// At-rule
		"at-rule-blacklist": [												// Specify a blacklist of disallowed at-rules.
			"debug", {
				severity: "warning"
			}],
		"at-rule-no-unknown": null,											// Disallow unknown at-rules.


		// Stylelint SCSS
		// https://github.com/kristerkari/stylelint-scss
		// ------------------------------------------------------------------------ /

		// @else
		"scss/at-else-closing-brace-newline-after": "always-last-in-chain", // Require or disallow a newline after the closing brace of @else statements.
		"scss/at-else-closing-brace-space-after": "always-intermediate", 	// Require a single space or disallow whitespace after the closing brace of @else statements.
		"scss/at-else-empty-line-before": "never", 							// Require an empty line or disallow empty lines before @-else.
		"scss/at-else-if-parentheses-space-before": "never",				// Require or disallow a space before @else if parentheses.

		// @extend
		"scss/at-extend-no-missing-placeholder": true, 						// Disallow at-extends (@extend) with missing placeholders.

		// @function
		"scss/at-function-named-arguments": null,								// Require named parameters in SCSS function call rule.
		"scss/at-function-pattern": null, 									// Specify a pattern for Sass/SCSS-like function names.
		"scss/at-function-parentheses-space-before": "never", 				// Require or disallow a space before @function parentheses.

		// @if
		"scss/at-if-closing-brace-newline-after": "always-last-in-chain", 	// Require or disallow a newline after the closing brace of @if statements.
		"scss/at-if-closing-brace-space-after": "always-intermediate", 		// Require a single space or disallow whitespace after the closing brace of @if statements.

		// @import
		"scss/at-import-no-partial-leading-underscore": null, 				// Disallow leading underscore in partial names in @import.
		"scss/at-import-partial-extension-blacklist": null, 				// Specify blacklist of disallowed file extensions for partial names in @import commands.
		"scss/at-import-partial-extension-whitelist": null, 				// Specify whitelist of allowed file extensions for partial names in @import commands.

		// @mixin
		"scss/at-mixin-argumentless-call-parentheses": "never", 			// Require or disallow parentheses in argumentless @mixin calls.
		"scss/at-mixin-named-arguments": null,									// Require named parameters in at - mixin call rule.
		"scss/at-mixin-pattern": null, 										// Specify a pattern for Sass/SCSS-like mixin names.
		"scss/at-mixin-parentheses-space-before": "never",					// Require or disallow a space before @mixin parentheses.

		// $variable
		"scss/dollar-variable-colon-newline-after": null, 					// Require a newline after the colon in $-variable declarations.
		"scss/dollar-variable-colon-space-after": "always", 				// Require a single space or disallow whitespace after the colon in $-variable declarations.
		"scss/dollar-variable-colon-space-before": "never", 				// Require a single space or disallow whitespace before the colon in $-variable declarations.
		"scss/dollar-variable-empty-line-before": null, 					// Require a single empty line or disallow empty lines before $-variable declarations.
		"scss/dollar-variable-no-missing-interpolation": true,				// Disallow Sass variables that are used without interpolation with CSS features that use custom identifiers.
		"scss/dollar-variable-pattern": /^[-a-z0-9]+$/, 					// Specify a pattern for Sass-like variables.

		// %placeholder
		"scss/percent-placeholder-pattern": null, 							// Specify a pattern for %-placeholders.

		// comment
		"scss/double-slash-comment-empty-line-before": null, 				// Require or disallow an empty line before //-comments.
		"scss/double-slash-comment-inline": null, 							// Require or disallow //-comments to be inline comments.
		"scss/double-slash-comment-whitespace-inside": "always", 			// Require or disallow whitespace after the // in //-comments

		// Declaration
		"scss/declaration-nested-properties": "never", 						// Require or disallow properties with - in their names to be in a form of a nested group.
		"scss/declaration-nested-properties-no-divided-groups": true, 		// Disallow nested properties of the same "namespace" be divided into multiple groups.

		// Media feature
		"scss/media-feature-value-dollar-variable": "always", 				// Require a media feature value be a $-variable or disallow $-variables in media feature values.

		// Operator
		"scss/operator-no-newline-after": null, 							// Disallow linebreaks after Sass operators.
		"scss/operator-no-newline-before": null, 							// Disallow linebreaks before Sass operators.
		"scss/operator-no-unspaced": null, 									// Disallow unspaced operators in Sass operations.

		// Partial
		"scss/partial-no-import": null, 									// Disallow non-CSS @imports in partial files.

		// Selector
		"scss/selector-no-redundant-nesting-selector": null,				 // Disallow redundant nesting selectors (&).



		// Stylelint Declaration Use Variable
		// ------------------------------------------------------------------------ /
		"sh-waqar/declaration-use-variable": [["/color/", "z-index", "font-size", { ignoreValues: ["transparent", "inherit", "initial"] }]],
	}
}