json stylelint规则 - 属性 - 订单example.json

Posted 2021-05-19

### Syntax:

 - https://github.com/stylelint/stylelint/issues/447
 - https://github.com/stylelint/stylelint/pull/470

Some groups are wrapped with objects only to label the group


Top-level is ordered(because it is an array)
 - `[ ]` - Ordered (frozen)
 - `{ }` - Unordered (free)

In unordered groups, you can make sub-groups by using number index keys `”0”`, `”1”`, `“2”`, etc(concise) or...
You can also use `-group-` vendor prefix to label groups. Our plugin will emit warnings like the following if groups are labeled:

If in right group, but wrong order:
> Expected property “content” to come before “box-sizing”

If it is in the wrong group (which also means wrong order):
> Expected property “box-sizing” to come before “top”. Property “top” should be in the “positioning” group.

"rule-properties-order": [2, [

	{
		"-group-overview": [
			"all",
			"content",
			"box-sizing",
			"will-change",
		]
	},

	"zoom",
	"z-index",
	"overflow",
	"overflow-x",
	"overflow-y",

	{
		"-group-positioning": [
			"position",
			{
				"top": null,
				"left": null,
				"right": null,
				"bottom": null
			},
			"perspective",
			"transform",
		]
	},


	{
		"-group-display": [
			"flex",
			{
				"flex-basis": null,
				"flex-grow": null,
				"flex-shrink": null,
				"align-self": null,
				"order"
			},
			"clear",
			"float",
			"visibility",
			"display",
			"vertical-align",
			{
				"table-layout": null,
				"empty-cells": null,
				"direction": null
			},
			{
				"flex-flow": null,
				"flex-wrap": null,
				"flex-direction": null,
				"justify-content": null,
				"align-items": null,
				"align-content": null
			},
		]
	},

	
	{
		"-group-dimensioning": [
			"width",
			"min-width",
			"max-width",
			"height",
			"min-height",
			"max-height",
		]
	},

	"margin",
	"padding",

	
	{
		"-group-aesthetic": [
			"opacity",
			"object-fit",
			"object-position",
			"clip-path",
			"background",

			"border",
			"outline",

			"border-radius",
			"box-shadow",
			"filter",
		]
	},

	"list-style",

	{
		"-group-text": [
			"color",
			"font",
			{
				"font-family": null,
				"font-variant": null,
				"0": [
					"font-size",
					"font-size-adjust",
					"line-height",
				],
				"word-spacing": null,
				"font-kerning": null,
				"font-weight": null,
				"font-stretch": null,
				"font-style": null
			}
			{
				"0": {
					"text-decoration": null,
					"text-underline-position": null
				},
				"1": {
					"text-transform": null,
					"text-shadow": null,
					"text-overflow": null,
					"text-align": null,
					"text-justify": null
				}
			}
		]
	},

	{
		"tab-size": null,
		"text-indent": null,
		"white-space": null
	},
	
	{
		"-group-paragraphs-and-wrapping": {
			"word-break": null,
			"hyphens": null,
			"orphans": null,
			"widows": null
		}
	},
	
	{
		"-group-cursor": {
			"pointer-events": null,
			"user-select": null,
			"0": [
				"cursor",
				"resize",
			]
		}
	},


	"animation",
	"animation-name",
	{
		"animation-play-state": null,
		"animation-direction": null,
		"animation-fill-mode": null,
		"animation-duration": null,
		"animation-delay": null,
		"animation-iteration-count": null,
		"animation-timing-function": null
	}

	"transition"
]],