pageClass | sidebarDepth | title | description | since |
---|---|---|---|---|
rule-details |
0 |
svelte/no-shorthand-style-property-overrides |
disallow shorthand style properties that override related longhand properties |
v0.31.0 |
disallow shorthand style properties that override related longhand properties
- ⚙️ This rule is included in
"plugin:svelte/recommended"
.
This rule reports when a shorthand style property overrides a previously defined longhand property.
This rule was inspired by Stylelint's declaration-block-no-shorthand-property-overrides rule.
<script>
/* eslint svelte/no-shorthand-style-property-overrides: "error" */
let red = 'red';
</script>
<!-- ✓ GOOD -->
<div style:background-repeat="repeat" style:background-color="green">...</div>
<div style="background-repeat: repeat; background-color: {red};">...</div>
<div style:background-repeat="repeat" style="background-color: {red}">...</div>
<!-- ✗ BAD -->
<div style:background-repeat="repeat" style:background="green">...</div>
<div style="background-repeat: repeat; background: {red};">...</div>
<div style:background-repeat="repeat" style="background: {red}">...</div>
Nothing.
This rule was introduced in eslint-plugin-svelte v0.31.0