I had made these changes in WebStorm , but the problem was that, in Svelte, reformatting code in WebStorm still, caused an issue where would appear. So, I had n
I had made these changes in WebStorm Editor > Code Style > HTML, but the problem was that, in Svelte, reformatting code in WebStorm still,
caused an issue where ✂prettier:content✂ would appear.
So, I had no choice but to try configuring it with ESLint.
import perfectionist from 'eslint-plugin-perfectionist';
{
files: ['**/*.svelte'],
plugins: {
sveltePlugin,
perfectionist,
},
languageOptions: {
parser: svelteParser,
parserOptions: {
parser: eslintTsParser,
extraFileExtensions: ['.svelte'],
},
},
rules: {
'prettier/prettier': 'error',
'perfectionist/sort-svelte-attributes': [
'error',
{
groups: ['class', 'unknown', 'data', 'on', 'multiline', 'aria', ['shorthand', 'svelte-shorthand']],
customGroups: {
class: 'class',
data: 'data-*',
on: 'on:*',
aria: 'aria-*',
},
},
],
},
},
You can add the perfectionist/sort-svelte-attributes rules like this.