You signed in with another tab or window. Reload to refresh your session.You signed out in another tab or window. Reload to refresh your session.You switched accounts on another tab or window. Reload to refresh your session.Dismiss alert
|[svelte/no-dynamic-slot-name](https://sveltejs.github.io/eslint-plugin-svelte/rules/no-dynamic-slot-name/)| disallow dynamic slot name |:star::wrench:|
329
-
|[svelte/no-export-load-in-svelte-module-in-kit-pages](https://sveltejs.github.io/eslint-plugin-svelte/rules/no-export-load-in-svelte-module-in-kit-pages/)| disallow exporting load functions in `*.svelte` module in SvelteKit page components. ||
330
329
|[svelte/no-not-function-handler](https://sveltejs.github.io/eslint-plugin-svelte/rules/no-not-function-handler/)| disallow use of not function in event handler |:star:|
331
330
|[svelte/no-object-in-text-mustaches](https://sveltejs.github.io/eslint-plugin-svelte/rules/no-object-in-text-mustaches/)| disallow objects in text mustache interpolation |:star:|
332
331
|[svelte/no-raw-special-elements](https://sveltejs.github.io/eslint-plugin-svelte/rules/no-raw-special-elements/)| Checks for invalid raw HTML elements |:wrench:|
@@ -415,6 +414,7 @@ These rules relate to SvelteKit and its best Practices.
415
414
416
415
| Rule ID | Description ||
417
416
|:--------|:------------|:---|
417
+
|[svelte/no-export-load-in-svelte-module-in-kit-pages](https://sveltejs.github.io/eslint-plugin-svelte/rules/no-export-load-in-svelte-module-in-kit-pages/)| disallow exporting load functions in `*.svelte` module in SvelteKit page components. ||
418
418
|[svelte/no-navigation-without-base](https://sveltejs.github.io/eslint-plugin-svelte/rules/no-navigation-without-base/)| disallow using navigation (links, goto, pushState, replaceState) without the base path ||
419
419
|[svelte/valid-prop-names-in-kit-pages](https://sveltejs.github.io/eslint-plugin-svelte/rules/valid-prop-names-in-kit-pages/)| disallow props other than data or errors in SvelteKit page components. ||
|[svelte/infinite-reactive-loop](./rules/infinite-reactive-loop.md)| Svelte runtime prevents calling the same reactive statement twice in a microtask. But between different microtask, it doesn't prevent. ||
20
-
|[svelte/no-dom-manipulating](./rules/no-dom-manipulating.md)| disallow DOM manipulating ||
|[svelte/no-shorthand-style-property-overrides](./rules/no-shorthand-style-property-overrides.md)| disallow shorthand style properties that override related longhand properties |:star:|
32
-
|[svelte/no-store-async](./rules/no-store-async.md)| disallow using async/await inside svelte stores because it causes issues with the auto-unsubscribing features ||
|[svelte/require-store-callbacks-use-set-param](./rules/require-store-callbacks-use-set-param.md)| store callbacks must use `set` param ||
35
-
|[svelte/require-store-reactive-access](./rules/require-store-reactive-access.md)| disallow to use of the store itself as an operand. Need to use $ prefix or get function. |:wrench:|
36
-
|[svelte/valid-compile](./rules/valid-compile.md)| disallow warnings when compiling. |:star:|
|[svelte/infinite-reactive-loop](./rules/infinite-reactive-loop.md)| Svelte runtime prevents calling the same reactive statement twice in a microtask. But between different microtask, it doesn't prevent. ||
20
+
|[svelte/no-dom-manipulating](./rules/no-dom-manipulating.md)| disallow DOM manipulating ||
|[svelte/no-shorthand-style-property-overrides](./rules/no-shorthand-style-property-overrides.md)| disallow shorthand style properties that override related longhand properties |:star:|
31
+
|[svelte/no-store-async](./rules/no-store-async.md)| disallow using async/await inside svelte stores because it causes issues with the auto-unsubscribing features ||
|[svelte/require-store-callbacks-use-set-param](./rules/require-store-callbacks-use-set-param.md)| store callbacks must use `set` param ||
34
+
|[svelte/require-store-reactive-access](./rules/require-store-reactive-access.md)| disallow to use of the store itself as an operand. Need to use $ prefix or get function. |:wrench:|
35
+
|[svelte/valid-compile](./rules/valid-compile.md)| disallow warnings when compiling. |:star:|
37
36
38
37
## Security Vulnerability
39
38
@@ -110,10 +109,11 @@ These rules extend the rules provided by ESLint itself, or other plugins to work
110
109
111
110
These rules relate to SvelteKit and its best Practices.
|[svelte/no-navigation-without-base](./rules/no-navigation-without-base.md)| disallow using navigation (links, goto, pushState, replaceState) without the base path ||
116
-
|[svelte/valid-prop-names-in-kit-pages](./rules/valid-prop-names-in-kit-pages.md)| disallow props other than data or errors in SvelteKit page components. ||
|[svelte/no-export-load-in-svelte-module-in-kit-pages](./rules/no-export-load-in-svelte-module-in-kit-pages.md)| disallow exporting load functions in `*.svelte` module in SvelteKit page components. ||
115
+
|[svelte/no-navigation-without-base](./rules/no-navigation-without-base.md)| disallow using navigation (links, goto, pushState, replaceState) without the base path ||
116
+
|[svelte/valid-prop-names-in-kit-pages](./rules/valid-prop-names-in-kit-pages.md)| disallow props other than data or errors in SvelteKit page components. ||
Copy file name to clipboardExpand all lines: docs/rules/html-self-closing.md
+35-21Lines changed: 35 additions & 21 deletions
Original file line number
Diff line number
Diff line change
@@ -14,10 +14,10 @@ since: 'v2.5.0'
14
14
15
15
## :book: Rule Details
16
16
17
-
You can choose either two styles for elements without content
17
+
You can choose either two styles for elements without content.
18
18
19
-
- always: `<div />`
20
-
- never: `<div></div>`
19
+
- always: `<SomeComponent />`
20
+
- never: `<SomeComponent></SomeComponent>`
21
21
22
22
<!-- prettier-ignore-start -->
23
23
<!--eslint-skip-->
@@ -28,18 +28,21 @@ You can choose either two styles for elements without content
28
28
</script>
29
29
30
30
<!-- ✓ GOOD -->
31
-
<div />
32
31
<p>Hello</p>
33
-
<div><div /></div>
32
+
<div></div>
34
33
<img />
35
34
<svelte:head />
35
+
<svg><path /></svg>
36
+
<math><msup></msup></math>
37
+
<SomeComponent />
36
38
37
39
<!-- ✗ BAD -->
38
-
<div></div>
39
-
<p> </p>
40
-
<div><div></div></div>
41
-
<img>
40
+
<div />
41
+
<div><div /></div>
42
42
<svelte:body></svelte:body>
43
+
<svg><path></path></svg>
44
+
<math><msup /></math>
45
+
<SomeComponent></SomeComponent>
43
46
```
44
47
45
48
<!-- prettier-ignore-end -->
@@ -52,7 +55,7 @@ presets:
52
55
{
53
56
"svelte/html-self-closing": [
54
57
"error",
55
-
"all"// or "html" or "none"
58
+
"default"// or "all" or "html" or "none"
56
59
]
57
60
}
58
61
```
@@ -65,8 +68,9 @@ config object:
65
68
"error",
66
69
{
67
70
"void":"always", // or "never" or "ignore"
68
-
"normal":"always", // or "never" or "ignore"
69
-
"foreign":"always", // or "never" or "ignore"
71
+
"normal":"never", // or "always" or "ignore"
72
+
"svg":"always", // or "never" or "ignore"
73
+
"never":"never", // or "always" or "ignore"
70
74
"component":"always", // or "never" or "ignore"
71
75
"svelte":"always"// or "never" or "ignore"
72
76
}
@@ -76,23 +80,33 @@ config object:
76
80
77
81
presets:
78
82
79
-
-`all` - all elements should be self closing (unless they have children)
80
-
-`html` - html-compliant - only void elements and svelte special elements should be self closing
81
-
-`none` - no elements should be self closing
83
+
-`default` - MathML and non-void HTML elements should have a closing tag; otherwise, they should be self-closing.
84
+
-`all` - all elements should be self-closing (unless they have children)
85
+
-`html` - html-compliant - only void elements and svelte special elements should be self-closing
86
+
-`none` - no elements should be self-closing
87
+
88
+
::: warning Note
89
+
We recommend selecting `default` as the preset. Choosing any other option may result in settings that are inconsistent with the compiler when using Svelte5.
90
+
:::
82
91
83
92
config object:
84
93
85
94
-`void` (`"always"` in default preset)... Style of HTML void elements
86
-
-`foreign` (`"always"` in default preset)... Style of foreign elements (SVG and MathML)
95
+
-`normal` (`"never"` in default preset)... Style of other elements
96
+
-`svg` (`"always"` in default preset)... Style of SVG
97
+
-`math` (`never` in default preset)... Style of MathML
87
98
-`component` (`"always"` in default preset)... Style of svelte components
88
99
-`svelte` (`"always"` in default preset)... Style of svelte special elements (`<svelte:head>`, `<svelte:self>`)
89
-
-`normal` (`"always"` in default preset)... Style of other elements
90
100
91
-
Every config oject option can be set to
101
+
::: warning
102
+
`foreign` is removed in `eslint-plugin-svelte` v3.
103
+
:::
104
+
105
+
Every config object option can be set to
92
106
93
-
- "always" (`<div />`)
94
-
- "never" (`<div></div>`)
95
-
- "ignore" (either `<div />` or `<div></div>`)
107
+
- "always" (`<SomeComponent />`)
108
+
- "never" (`<SomeComponent></SomeComponent>`)
109
+
- "ignore" (either `<SomeComponent />` or `<SomeComponent></SomeComponent>`)
0 commit comments