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
Copy file name to clipboardExpand all lines: packages/svelte/messages/compile-warnings/template.md
+26Lines changed: 26 additions & 0 deletions
Display the source diff
Display the rich diff
Original file line number
Diff line number
Diff line change
@@ -34,6 +34,32 @@
34
34
35
35
> Self-closing HTML tags for non-void elements are ambiguous — use `<%name% ...></%name%>` rather than `<%name% ... />`
36
36
37
+
In HTML, there's [no such thing as a self-closing tag](https://jakearchibald.com/2023/against-self-closing-tags-in-html/). While this _looks_ like a self-contained element with some text next to it...
38
+
39
+
```html
40
+
<div>
41
+
<spanclass="icon" /> some text!
42
+
</div>
43
+
```
44
+
45
+
...a spec-compliant HTML parser (such as a browser) will in fact parse it like this, with the text _inside_ the icon:
46
+
47
+
```html
48
+
<div>
49
+
<spanclass="icon"> some text! </span>
50
+
</div>
51
+
```
52
+
53
+
Some templating languages (including Svelte) will 'fix' HTML by turning `<span />` into `<span></span>`. Others adhere to the spec. Both result in ambiguity and confusion when copy-pasting code between different contexts, and as such Svelte prompts you to resolve the ambiguity directly by having an explicit closing tag.
54
+
55
+
To automate this, run the dedicated migration:
56
+
57
+
```bash
58
+
npx sv migrate self-closing-tags
59
+
```
60
+
61
+
In a future version of Svelte, self-closing tags may be upgraded from a warning to an error.
62
+
37
63
## event_directive_deprecated
38
64
39
65
> Using `on:%name%` to listen to the %name% event is deprecated. Use the event attribute `on%name%` instead
0 commit comments